[Vue 2.x Todo 教程练习参考答案] 入门仪式_Hello_Vue练习参考答案

练习一

需在 send 方法中做判断，当用户点击发送按钮，检测到 input 中没有输入任何值时，直接弹框提示并返回，只有有值才执行后续逻辑，示例代码如下：

methods: {
    send: function () {
        if (!this.count) {
            alert('请输入内容！');
            return
        }
        alert('发送成功！');
        this.value = ''
    }
},

练习二

参考官方文档我们可以看到 v-if 指令用于条件渲染元素，仅当 v-if 后面的表达式为真时，元素才被渲染，因此参考代码如下：

<div v-if="count">value 的值是：{{ value }}</div>

注意这里 count 是我们定义的计算属性，其值为 value 的长度，正好作为 v-if 的逻辑表达式，仅当 value 有值时，count 才非零（视为真），否则 count 为零（视为假，div 不被渲染）。

-- EOF --