vue实现动态按钮?

vue实现动态按钮借助iview的Button,由于这些按钮是配置出来的,目前没有代码,还不清楚怎么写,所以麻烦大佬们了

如图
1690357488258.png

期望能在各个vue组件使用的,然后通过不同的点击来触发事件,希望大佬们,给个思路

阅读 2.1k
1 个回答

你先不考虑动态的,只写静态的 templete 部分

<Button type="default">批量导出</Button>
<Button type="primary">录入检测结果</Button>
<Button type="success">提交流转</Button>

这样按钮就出来的,然后就是提取变量转换为 json

buttons = [
    {type:'default',text:'批量导出'},
    {type:'primary',text:'录入检测结果'},
    {type:'success',text:'提交流转'},
]

接下来就是 templete 和 json 的组合

<Button v-for="button in buttons" :type="button.type">{{button.text}}</Button>

然后就是事件了,可以绑定 event,然后无非就是url、入参什么的配置。

当然也可以抛给 eventBus

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题