我试图让HTML输入反映在Vue开发工具面板和控制台中,但它们都没有工作。
我的刀片文件包含此代码。
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="csrf-token" content="{{ csrf_token() }}">
<link rel="stylesheet" href="{{ asset('css/app.css') }}">
<title>Chat Room</title>
</head>
<body>
<div class="container" id="app">
<div class="row">
<ul class="list-group offset-4 col-4">
<li class="list-group-item active">Chat Room</li>
<input type="text" class="form-control" placeholder="Type your
message here" v-model="text" @keyup='send'></input>
</ul>
</div>
</div>
{{-- <script src="{{ asset('js/app.js') }}"></script> --}}
</body>
</html>
app.js是这样的。
require('./bootstrap');
window.Vue = require('vue');
Vue.component('message', require('./components/message.vue'));
const app = new Vue({
el: '#app',
data: {
text:''
},
method:{
send(){
console.log(this.message);
}
}
});
问题是我没有得到任何错误,但绑定也无法正常工作。我正在寻找html中的输入文本,以显示在控制台和vue面板数据数组中。
Layout.app已经包含了html头部和body标签不是吗?此时,您将在页面中放置一个全新的页面
所以它不会起作用,因为第一个div#app在app.blade.php中
编辑:加上您的脚本注释刀片行注释标记