如何在vue里面实现评论功能
前几天做了文章的评论功能,现在用文字记录下来,希望帮助更多的人//html<div class="bottom"><div class="coomment" @click="show"><i class="el-icon-chat-line-round"></i>评论<...
·
前几天做了文章的评论功能,现在用文字记录下来,希望帮助更多的人
//html
<div class="bottom">
<div class="coomment" @click="show">
<i class="el-icon-chat-line-round"></i>评论
</div>
</div>
<div class="commentdec">
<textarea v-model="newItem" v-on:keyup.enter="addNew" v-if="msg" />
<ul>
<li
v-for="(item,index) in items"
v-bind:class="{finished: item.isFinished}"
v-on:click="toggleFinish(item)"
:key="index"
>{{item.label}}</li>
</ul>
</div>
//js
data() {
return {
msg: false,
items: [],
newItem: "",
};
},
methods: {
toggleFinish(item) {
item.isFinished = !item.isFinished;
},
addNew() {
axios
.post("接口地址", 传参)
.then(res => {});
his.items.push({
label: this.newItem,
isFinished: false
});
this.newItem = "";
this.msg = false;
},
show() {
this.msg = !this.msg;
},
}
更多推荐
已为社区贡献7条内容
所有评论(0)