传递和使用从 json 到 javascript 的数据

Question

我在 php 页面中调用了一个 javascript 函数。我还向该函数添加了一个 json 方法，用于从数据库中提取数据。这是它的样子：

$this->registerJsFile('/js/restaurant-reserve.js', ['depends' => [JqueryAsset::class]]);
$this->registerJs('restaurantReserve.init('. Json::encode($restaurant->workHours) .')');

因此，在页面末尾，我得到了以下形式的数据：

restaurantReserve.init([{"id":86,"restaurant_id":1,"day":"Mon","open":"9.30","close":"14.30","created_at":"2022-02-22 10:56:15"}])

但我想在 javascript 文件本身中使用此数据，restaurantReserve 函数所在的位置。

因为现在我必须手动完成:

let json = [{"id":86,"restaurant_id":1,"day":"Mon","open":"9.30","close":"14.30","created_at":"2022-02-22 10:56:15"}]

如何让 json 数据到达 javascript 以便我可以使用它？不要手写。

更新

我想到了一个答案，就是添加这一行，它将全局声明这个变量：

$this->registerJs('let json = '. Json::encode($restaurant->workHours) .';');

但是发现这个变量是在使用这个变量的restaurant-reserve.js文件的脚本执行后声明的，有点不懂怎么弄高

这是我在 php 文件中的最终代码：

$this->registerJs('let json = '. Json::encode($restaurant->workHours) .';');
$this->registerJsFile('/js/restaurant-reserve.js', ['depends' => [JqueryAsset::class]]);
$this->registerJs('restaurantReserve.init()');

我在页面上得到的结果首先是文件，然后是这个变量：

<script src="/js/restaurant-detail.js"></script>
<script src="/js/share.js"></script>
<script>jQuery(function ($) { 
let json = [{"id"...}]
</script>

可以做什么？？

Answer 1

您可以在代码中添加以下行

$this->registerJs('let json = '. Json::encode($restaurant->workHours) .';');

阅读您的评论和进一步的问题后更新答案。

你可以再传第二个参数给registerJs函数。 View::POS_READYor View::POS_BEGIN

喜欢：

$this->registerJs('let json = '. Json::encode($restaurant->workHours) .';', View::POS_READY);

Answer 2

registerJs 中的第二个参数与此问题有关。
也就是说，第二个参数决定脚本应该插入页面的哪个位置。可能的值是：

View::POS_HEAD  for head section.
View::POS_BEGIN  for right after opening <body>.
View::POS_END  for right before closing </body>.
View::POS_READY  for executing code on the document ready event. This will automatically register jQuery and wrap the code into the appropriate jQuery code. This is the default position.
View::POS_LOAD  for executing code on the document load event. Same as the above, this will also register jQuery automatically.

The first argument is the actual JS code we want to insert into the page. It will be wrapped into a tag. The second argument determines at which position the script should be inserted into the page.

对于脚本文件，您还可以指定加载它的地点和时间。根据依赖和....
最好参考这个link.

传递和使用从 json 到 javascript 的数据

Pass and use data from json to javascript

javascript

php

json

yii2