Vue“数据”没有通过html中的输入标签进行更改答案

【问题标题】：Vue 'data' not getting changed through input tag in htmlVue“数据”没有通过html中的输入标签进行更改
【发布时间】：2019-09-16 07:34:54
【问题描述】：

我试图让 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);
      }
    }
});

问题是我没有收到任何错误，但绑定也不起作用。我正在寻找要在控制台和vue面板数据数组中显示的html中的输入文本。

【问题讨论】：

标签： javascript laravel vue.js laravel-blade

【解决方案1】：

Layout.app 已经包含了 html 的 head 和 body 标签，不是吗？这时候你在页面里面放了一个全新的页面

所以它不起作用，因为第一个 div#app 在 app.blade.php 中

编辑：加上你的脚本用刀片线注释标记来注释

【讨论】：

对，但即使我删除标签也不起作用。
我称之为 pageception 的东西怎么样？
取消注释脚本标签会在控制台中出现错误 Uncaught TypeError: Pusher.ScriptReceivers[1] is not a function。我猜那是因为 layouts.app 已经包含了 js 脚本。但即使这样也行不通。
可以把layout.app的内容发布一下吗？
哦，等等……它成功了……我删除了所有页面，只保留了输入标签并将“app”更改为“app2”……成功了……谢谢伙计。我已经尝试了其他所有方法。有时只需要整理一下。