[英]Updating bootstrap-vue alert's content
I'd like to know how to update a Bootstrap-Vue ( Bootstrap-Vue ) alert's content after it's shown. 我想知道如何在显示后更新Bootstrap-Vue( Bootstrap-Vue )警报的内容。
This is needed in such a scenario: display an alert with a link, the user clicks the link to initiate a remote operation, the alert displays a loading indicator, the the operation completes, finally the alert displays a success message. 在这种情况下需要这样做:显示带有链接的警报,用户单击链接以启动远程操作,警报显示加载指示器,操作完成,最后警报显示成功消息。
It's just like updating any other reactive property. 就像更新其他任何反应性属性一样。 The example below shows three states... default, loading and updated.
下面的示例显示了三种状态...默认,加载和更新。
<template>
<div id="app">
<b-alert show>{{ alertText }}</b-alert>
<b-btn @click="updateText">Update Text</b-btn>
</div>
</template>
<script>
export default {
name: "App",
data() {
return {
alertText: 'Default text',
}
},
methods: {
updateText() {
this.alertText = 'loading'
setTimeout(() => {
this.alertText = Math.random()
}, 2000)
},
}
}
</script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.