vue官网：https://cn.vuejs.org/index.html
视图：http://v1.iviewui.com/
错误：：
vue.js:634 [Vue warn]: Error compiling template:
invalid expression: Invalid or unexpected token in
“itemRemove(index)”
Raw expression: @click="“itemRemove(index)”"
4 |
5 |- {{item.content}} - {{item.createTime}} -{{index}}
6 | <a href="#" @click="“itemRemove(index)”">删除
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^
7 | <a href="#" @click=“itemDown(index)”>完成
8 |(found in )
解决："" 存在中文符号
基础学习代码：
<!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="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<style>
.textThrough{
text-decoration: line-through;
}
</style>
<body>
<div id="app">
<input type="text" v-model="textContent" @keydown.enter="postContent"/>
<button @click="postContent" ></button>
<ul>
<li v-for="(item,index) in ls" :class="{textThrough :item.isActive}">{{item.content}} - {{item.createTime}} -{{index}}
<a href="#" @click="itemRemove(index)"">删除</a>
<a href="#" @click="itemDown(index)">完成</a>
</li>
</ul>
</div>
</body>
<script>
var vm = new Vue({
el : "#app",
data:{
ls :[],
textContent:'ddd',
},
methods:{
postContent(){
this.ls.push({
content: this.textContent,
createTime: new Date(),
isActive:false
})
this.textContent = ""
},
itemRemove(index){
this.ls.splice(index,1)
},
itemDown(index){
this.ls[index].isActive = true;
}
}
})
</script>
</html>
4015
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
