十六、Vue之 template 中取data()中数据的注意点

  在template 中取data()中数据注意DOM属性和非属性之间的区别：

1.DOM属性中取数值

<template>
    <div>
        <input type="text" v-model="todo" @keydown="addByEnterKey" />
    </div>
</template>

<script>
export default {
    data() {
        return {
            todo: '待取数值'
        }
    }
}
</script>

2.DOM非属性取数值

<template>
    <div>
        {{todo}}
    </div>
</template>

<script>
export default {
    data() {
        return {
            todo: '待取数值'
        }
    }
}
</script>

  根据上面即可看出，若是DOM属性中取​​data()​​​中数据，直接写属性名即可，而DOM非属性取值，则需要加上​​{{**}}​​，这点和小程序是不一样的！！！