vue3中接收点击事件传过来的值随点击事件的值变化进行渲染
时间: 2024-05-03 10:17:07 浏览: 99
vue动态渲染svg、添加点击事件的实现
5星 · 资源好评率100%
你可以使用Vue3中的响应式数据来实现点击事件传值渲染的效果。具体可以参考以下代码:
1. 在data中定义一个变量来存储点击事件的值
```javascript
data() {
return {
clickValue: ''
}
}
```
2. 在模板中绑定点击事件,并将点击的值赋值给clickValue
```html
<button @click="clickValue = 'value1'">Button1</button>
<button @click="clickValue = 'value2'">Button2</button>
```
3. 在模板中使用clickValue来渲染需要的内容
```html
<div>{{ clickValue }}</div>
```
这样,当你点击Button1时,clickValue的值会变为'value1',从而触发模板中的重新渲染,显示'value1'。同理,当你点击Button2时,clickValue的值会变为'value2',从而触发模板中的重新渲染,显示'value2'。
阅读全文