这篇文章主要介绍了vue中给el-radio添加tooltip并实现点击跳转方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
给el-radio添加tooltip并实现点击跳转
goToRout(){ let routeData = this.$router.resolve({name: '/your url', params: {active:'1'}}); window.open(routeData.href, '_blank'); } {{toolTipContent}}New Youk
说明：
（1）toolTipDisable：可控制tooltip是否可用
（2）slot=“content”：表示tooltip提示的内容指定已DOM格式插入到页面
（3）goToRout()：路由跳转方法
（4）toolTipContent：提示的内容信息
element表格(el-table)自定义复选框(添加提示el-tooltip)
需求
表格想要存在禁用的行，用户想要有提示：为什么不可以勾选！！！（如下图）
实现
使用表格自带的复选框无法实现该功能，因此需要自定义复选框
html代码：
js代码：
export default { data() { return { dataList: [], isCheck: false, indeterminate: false, enabledDataList: [],//这个指没有被禁用的行，进来组件的时候需要自己处理下 checkedCount: 0, selection: [] } }, methods: { handleCheckAllChange(value) { this.selection = value ? this.enabledDataList : []; this.indeterminate = false; this.$emit('input', this.selection) }, }, watch: { selection: { handler(v) { console.log(v) //这里采用监听selection的变化而不是使用el-checkbox-group的change事件是因为： // 在change事件中往父组件发消息时，表单已经完成了异步的验证，所以无法在表单验证前将选中的值发给父组件 if (this.enabledDataList.length) {//这个条件是判断需要有。。。。 let checkedCount = v.length; this.isCheck = checkedCount === this.enabledDataList.length; this.indeterminate = checkedCount > 0 && checkedCount 上面是实现代码的demo，亲测可以实现功能。
这里存在一个大坑（表单验证）
这表格我需要复用，因此我写成一个组件的形式，因此需要使用$emit(‘input’,选中的行)进行传值，但是这里存在一个问题，就是：我本用
解决办法：
使用watch监听selection变量
效果
小优化
若不想要显示复选框右边的文字（由el-checkbox 的label设置，必填要有值），可以使用visibility: hidden;
.el-checkbox__label { visibility: hidden; }总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持0133技术站。
以上就是vue中给el-radio添加tooltip并实现点击跳转方式的详细内容，更多请关注0133技术站其它相关文章！
