add.vue Failed tto compile.

来源:4-4 单页面应用 Demo2(1)

Icbto

2019-05-16 10:51

https://img3.mukewang.com/5cdccf740001bd2b13640665.jpg提示说v-if用错,但是只用了v-model呀

 <template>
  <div>Add</div>
  <div>
    <p>Title</p>
    <label>
      <input type="text" v-model="title">
    </label>
    <p>Content</p>
    <label>
      <input type="text" v-model="content">
    </label>
    <div class="btn" @click="add()">ADD</div>
  </div>
</template>

<script>
    import store from '@/store'
    export default {
        name: "Add",
        store,
        data () {
            return {
                title: '',
                content: ''
            }
        },
        methods: {
            add () {
                store.commit('addItem', {
                    title: this.title,
                    content: this.content,
                    });
                this.title = '';
                this.content = '';
                this.$router.push('/homespacer.gifst')
            }
        }
    }
</script>

<style scoped>

</style>


写回答 关注

1回答

  • Brian
    2019-05-16 11:04:49
    已采纳

    ? 同学,这个注释写的很清楚了啊,直译过来就是:

    组件 template中需要有一个根块元素。这个才是你报错的原因,把你的template,套一个div,像这样:

    <template>

    <div>

      <div>Add</div>
      <div>
        <p>Title</p>
        <label>
          <input type="text" v-model="title">
        </label>
        <p>Content</p>
        <label>
          <input type="text" v-model="content">
        </label>
        <div class="btn" @click="add()">ADD</div>
      </div>

    </div>
    </template>

    Icbto

    啊! 对,我刚才查到,最开始的时候一直纠结明明没有v-if,怎么提示让改成v-if-else,谢谢老师~ ❤

    2019-05-16 11:12:12

    共 1 条回复 >

3小时速成 Vue2.x 核心技术

带你快速学习最流行的前端框架vue2.x的核心技术

82572 学习 · 489 问题

查看课程

相似问题