我有这样的导航栏:
<nav class="navbar">
<p style="text-align: center; color: white;">{{ @$test}}</p>
</nav>
我的页面看起来像:
<body class="">
<div id="app">
<div class="">
@include('navbar')
@yield('content') <- here another components
</div>
</div>
</body>
如何使用 vue.js 更改 @$test laravel 变量?
最佳答案
Prop 是你能做的唯一明智的事情。你必须让它们工作,否则将 vue 与组件一起使用将只是一个毫无意义的练习。
基于此响应:https://stackoverflow.com/a/46076011/487813
在组件中使用 prop
:
props: ['test'],
<template>
<nav class="navbar">
<p style="text-align: center; color: white;">{{test}}</p>
</nav>
</template>
这里的{{test}}
是Vue.js指令写test的属性值
在navbar.blade.php
<component-name :test="{{$test}}"></component-name>
这里的 {{$test}}
是用来回显 PHP 变量 test 的 blade 指令。
<body class="">
<div id="app">
<div class="">
@php
$test = 'set the right value for test here or anywhere before including the navbar';
@endphp
@include('navbar')
@yield('content') <- here another components
</div>
</div>
</body>
关于javascript - 使用 vue.js 在每个页面上更改 laravel 变量,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46077257/