带有 VueJS 和 Laravel 的 Textarea v-model 初始值
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/49767714/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Textarea v-model initial value with VueJS and Laravel
提问by Prasanna Kumar
I want to display the username as the default textarea value for markdown editor using blade syntax.
我想使用刀片语法将用户名显示为 Markdown 编辑器的默认 textarea 值。
<textarea v-model="message">
{{ $detailsFromLaravelContoller }}
</textarea>
<div v-html="compiledMarkdown"></div>
But I am using v-model component for the textarea which requires to declare message with an empty valuelike this
但是我正在为 textarea 使用 v-model 组件，它需要像这样声明带有空值的消息
window.onload = function()
{
var editor = new Vue({
el: '#editor',
data: {
message: '',
compiledMarkdown: marked('', { sanitize: true }),
},
watch: {
markdown: function () {
this.compiledMarkdown = marked(this.message, { sanitize: true })
}
},
methods: {
}
})
}
This renders the screen with the laravel variable's value. But soon after the page loads the content disappears(as I've used window.onload I guess).
Also I'm not using inline VueJS.
P.S: I'm new to both VueJS and Laravel and the source for the markdownis here(jsfiddle)
Thank you in advance!!!
这将使用laravel 变量的 value呈现屏幕。但是在页面加载后不久内容就消失了（因为我已经使用了 window.onload 我猜）。
另外我没有使用内联 VueJS。
PS：我是新来的都VueJS和Laravel和对降价的来源是在这里（的jsfiddle）
预先感谢您！
采纳答案by Jacob Goh
You are trying to pass a PHP variable value to a separate Javascript file.
您正在尝试将 PHP 变量值传递给单独的 Javascript 文件。
Here's how I would do it:
这是我将如何做到的：
Declare a global variable detailsFromLaravelContollerto store $detailsFromLaravelContoller as a string value
声明一个全局变量detailsFromLaravelContoller将 $detailsFromLaravelContoller 存储为字符串值
<script>
var detailsFromLaravelContoller = @json($detailsFromLaravelContoller);
</script>
<textarea v-model="message">
</textarea>
use the global variable in Javascript file
在 Javascript 文件中使用全局变量
data: {
message: detailsFromLaravelContoller,
},
回答by Agney
You can initialize the v-modelin data with your laravel variable.
您可以v-model使用 Laravel 变量初始化in 数据。
window.onload = function()
{
var editor = new Vue({
el: '#editor',
data: {
message: {!! $detailsFromLaravelContoller !!},
compiledMarkdown: marked('', { sanitize: true }),
},
watch: {
markdown: function () {
this.compiledMarkdown = marked(this.message, { sanitize: true })
}
},
methods: {
}
})
}
