v模型在laravel vuejs中不起作用

Question

我在Laravel应用中使用ElementUI，我面临的问题是v-model指令不起作用。我也尝试过放置普通输入，但是v-model指令仍然无法正常工作。

export default {
  props: ['cardHeading'],
  data() {
    return {
      formData: {
        name: 'asdf',
        password: ''
      },
      csrfToken: window.Laravel.csrfToken
    }
  },
  methods: {
    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          alert('submit!');
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    }
  },
  mounted() {
    console.log(this.formData);
  }
}

<el-form ref="form" label-position="right" :model="formData" label-width="100px">
  <h1>{{cardHeading}}</h1>
  <input type="hidden" name="_token" :value="csrfToken">
  <el-form-item label="Email: ">
    <el-input type="email" v-model="formData.name"></el-input>
  </el-form-item>
  <el-form-item label="Password: ">
    <el-input type="password" suffix-icon="fa-icon-view" v-model="formData.password"></el-input>
  </el-form-item>
  <el-form-item>
    <el-button type="primary" round>Create<i class="el-icon-d-arrow-right"></i></el-button>
  </el-form-item>
</el-form>

Answer 1

我不确定这是否是问题，但这绝对是一个问题。

在您的layouts/app.blade.php中两次加载app.js。我建议删除第15行的head中的一个：

<!-- Scripts -->
<script src="{{ asset('js/app.js') }}" defer></script>