2-5 编程练习代码提交
来源：2-5 编程练习
MiMicccc
2021-09-10 16:31:16
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>TodoList</title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id="app">
<!-- 在此补充代码 -->
<div class="box">
<input v-model="inputValue" type="text" placeholder="请输入喜欢吃的水果">
<button v-on:click="addTxet">添加</button>
<ul>
<li v-for="item in list">{{item}}</li>
</ul>
</div>
</div>
<script>
// 在此补充代码
let box = new Vue({
el: '.box',
data: {
list: [],
inputValue: ''
},
methods: {
addTxet: function () {
// 判断如果是空不添加
if (!this.inputValue) return;
this.list.push(this.inputValue);
this.inputValue = ''
}
}
})
</script>
</body>
</html>写回答
1回答
-
好帮手慕星星
2021-09-10
同学你好，代码实现效果很棒。继续加油，祝学习愉快！
0
相似问题