首页 > 解决方案 > 从 Laravel Blade 向 Vue.Js 传递 props 返回 undefined

问题描述

我试图将 Laravel 刀片中的道具传递给 Vue 元素,尝试使用: :datadata 都不起作用。

在 Vue Devtool 上返回 undefined。

文件.blade.php

<div id="truthchallenge">
  <truth-challenge data="datastring" />
</div>

真相挑战.js (main.js)

import Vue from 'vue'
import router from '../router'
import TruthChallenge from './views/TruthChallenge'

new Vue({
  router,
  render: h => h(TruthChallenge)
}).$mount('#truthchallenge')

真相挑战.vue

<script>
export default {
  name: 'truth-challenge',
  props: {
    data: String
  }
}
</script>

我试图将道具从 vue.js 传递给孩子,它可以工作,但不能来自 Laravel 刀片。你有关于我的代码不起作用的线索吗?

标签: laravelvue.js

解决方案


如果我理解正确,您是在尝试将 php 变量传递给 Vue 模板吗?

试试这样:

<truth-challenge :data="{{ $data }}"/>

推荐阅读