vue中使用element ui的el-badge组件实时更新值
使用el-badge组件，红点标记，当数据库数据更新时，如何让页面重新渲染，实时更新
使用this.$forceupdate 。没有效果
那你需要 请求 接口 ，并且改变messageReveal .
this.messageReveal = 接口返回的 。
调接口，赋值就行，要不就用定时器重新调用接口
data有先定义messageReveal吗？
或者用this.$set
直接修改is-dot绑定的messageReveal值就行
回调函数直接this.messageReveal=true/false你要更改的，返回值也行，布尔值
不需要强制刷新，动态绑定的，会自己渲染
<template>
<div class="login-wrap">
<el-badge :is-dot="isShow" class="item">数据查询</el-badge>
<el-badge is-dot class="item">
<el-button class="share-button" icon="el-icon-share" type="primary"></el-button>
</el-badge>
<el-button @click="changeBadge">点击显示红点</el-button>
<el-button @click="changeBadge1">点击去掉红点</el-button>
</div>
</template>
<script>
export default {
data: function() {
return {
isShow: false,
};
},
methods: {
changeBadge() {
this.isShow = true
},
changeBadge1() {
this.isShow = false
}
}
};
</script>
默认不显示红点如图
点击显示红点，结果如图
点击去掉红点，结果如图
