用PHP将JSON转换为CSS

I have some encoded JSON data stored in my database, like the following:

我在数据库中存储了一些编码的JSON数据，如下所示:

{".main-header":"{\"color\":\"rgb(5, 213, 255)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"NeutraText-Book\",\"font-size\":\"35px\"}",".main-header-free":"{\"color\":\"rgb(0, 0, 0)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"NeutraText-Book\",\"font-size\":\"22px\"}",".sub-header-lunch-price":"{\"color\":\"rgb(0, 0, 0)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"NeutraText-Book\",\"font-size\":\"22px\"}",".sub-header-week":"{\"color\":\"rgb(62, 214, 24)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"NeutraText-Book\",\"font-size\":\"22px\"}",".sub-header-week-week":"{\"color\":\"rgb(0, 0, 0)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"NeutraText-Book\",\"font-size\":\"22px\"}",".day-name":"{\"color\":\"rgb(237, 129, 5)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"NeutraText-Book\",\"font-size\":\"22px\"}",".lunchtext":"{\"color\":\"rgb(0, 0, 0)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"Baskerville\",\"font-size\":\"13px\"}",".puffheading":"{\"color\":\"rgb(0, 0, 0)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"NeutraText-Book\",\"font-size\":\"22px\"}",".pufftext":"{\"color\":\"rgb(0, 0, 0)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"Baskerville\",\"font-size\":\"13px\"}",".re_name":"{\"color\":\"rgb(0, 0, 0)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"'Times New Roman'\",\"font-size\":\"13px\"}",".re_address":"{\"color\":\"rgb(0, 0, 0)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"'Times New Roman'\",\"font-size\":\"13px\"}",".re_phone":"{\"color\":\"rgb(0, 0, 0)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"'Times New Roman'\",\"font-size\":\"13px\"}",".re_webpage":"{\"color\":\"rgb(0, 0, 0)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"'Times New Roman'\",\"font-size\":\"13px\"}","html":"{\"background\":\"none\"}"}

This is how I would do it with jquery:

这就是我使用jquery的方法:

var currentStyle = {{ $theme->css}};

$.each(currentStyle, function( index, value ) {
   $(index.toString()).css(jQuery.parseJSON(value)));
});

In my Controller, I render the view and then converts it to a PDF:

在我的控制器中，我呈现视图，然后将其转换为PDF:

    $view = View::make('pdf.template')
                ->with('css', $css);

    $pdf = PDF::loadHTML($view);
    return $pdf->stream();

This means that the view rendered will return the DOM in its initial state, I cannot use any JavaScript to apply the JSON CSS with say jquery, because of that.

这意味着呈现的视图将返回初始状态的DOM，因此我不能使用任何JavaScript使用jquery应用JSON CSS。

So can I directly convert this JSON to CSS through PHP somehow?

那么我可以通过PHP直接将JSON转换为CSS吗?

1 个解决方案

#1

You will need to generate valid css in your php script:

您需要在php脚本中生成有效的css:

$str = '{".main-header":"{\"color\":\"rgb(5, 213, 255)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"NeutraText-Book\",\"font-size\":\"35px\"}",".main-header-free":"{\"color\":\"rgb(0, 0, 0)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"NeutraText-Book\",\"font-size\":\"22px\"}",".sub-header-lunch-price":"{\"color\":\"rgb(0, 0, 0)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"NeutraText-Book\",\"font-size\":\"22px\"}",".sub-header-week":"{\"color\":\"rgb(62, 214, 24)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"NeutraText-Book\",\"font-size\":\"22px\"}",".sub-header-week-week":"{\"color\":\"rgb(0, 0, 0)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"NeutraText-Book\",\"font-size\":\"22px\"}",".day-name":"{\"color\":\"rgb(237, 129, 5)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"NeutraText-Book\",\"font-size\":\"22px\"}",".lunchtext":"{\"color\":\"rgb(0, 0, 0)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"Baskerville\",\"font-size\":\"13px\"}",".puffheading":"{\"color\":\"rgb(0, 0, 0)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"NeutraText-Book\",\"font-size\":\"22px\"}",".pufftext":"{\"color\":\"rgb(0, 0, 0)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"Baskerville\",\"font-size\":\"13px\"}",".re_name":"{\"color\":\"rgb(0, 0, 0)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"\'Times New Roman\'\",\"font-size\":\"13px\"}",".re_address":"{\"color\":\"rgb(0, 0, 0)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"\'Times New Roman\'\",\"font-size\":\"13px\"}",".re_phone":"{\"color\":\"rgb(0, 0, 0)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"\'Times New Roman\'\",\"font-size\":\"13px\"}",".re_webpage":"{\"color\":\"rgb(0, 0, 0)\",\"background-color\":\"rgba(0, 0, 0, 0)\",\"font-family\":\"\'Times New Roman\'\",\"font-size\":\"13px\"}","html":"{\"background\":\"none\"}"}';
$arr = json_decode($str, true);
$css='';
foreach($arr as $key => $val){
    $css.=$key . '{' . PHP_EOL;
    foreach(json_decode($val, true) as $k => $v){
        $css.=$k . ':' . $v . ';' . PHP_EOL;
    }
    $css.= '}' . PHP_EOL;
}
//to see result
//echo '<pre>' . $css . '</pre>';
$view = View::make('pdf.template')
            ->with('css', $css);

$pdf = PDF::loadHTML($view);
return $pdf->stream();

Then in your view echo $css withing <style>...</style> tags.

然后在您的视图中echo $css withing

Note that the new lines (PHP_EOL) are only for formatting, and are not needed.

注意，新行(PHP_EOL)只用于格式化，不需要。

#1