如何提高编程思维
# 具体遇到的问题
# 报错信息的截图
# 相关课程内容截图
# 尝试过的解决思路和结果
# 粘贴全部相关代码,切记添加代码注释(请勿截图)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="./vue.js"></script>
</head>
<body>
<div id="app">
<input type="text" placeholder="请输入喜欢吃的水果" v-model="inputValue">
<button @click="handleBtnClick">提交</button>
<ul>
<li v-for="item in list">{{item}}</li>
</ul>
</div>
<script>
var app = new Vue({
el: '#app',
data: {
inputValue: '',
list: []
},
methods: {
handleBtnClick() {
if (!this.inputValue) return
this.list.push(this.inputValue)
this.inputValue = ''
}
},
})
</script>
</body>
</html>
正在回答
同学你好,代码实现效果很棒!
另外编程思维需要慢慢培养,最好的方式是多做练习,总结编程实现方式,等遇到类似的也就能举一反三了。
祝学习愉快!
- 参与学习 人
- 提交作业 239 份
- 解答问题 10739 个
本阶段带你深入前端开发的肌理,通过ES6基础知识和前端主流高级框架的学习,助你快速构建企业级移动webAPP应用,进入职场的终极battle
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星