vue中如何给el-radio添加tooltip并实现点击跳转

<el-tooltip :disabled="toolTipDisable" placement="bottom" effect="light"><div slot="content" @click="goToRout()">{{toolTipContent}}</div><el-radio label="3">New Youk&...

透过代码观世界

2703人浏览 · 2020-03-04 11:15:46

透过代码观世界 · 2020-03-04 11:15:46 发布

<el-tooltip :disabled="toolTipDisable" placement="bottom" effect="light">
    <div slot="content" @click="goToRout()">{{toolTipContent}}</div>
    <el-radio label="3">New Youk</el-radio>
</el-tooltip>


goToRout(){
   let routeData = this.$router.resolve({name: '/your url', params: {active:'1'}});
   window.open(routeData.href, '_blank');
}

说明：
（1）toolTipDisable：可控制tooltip是否可用
（2）slot=“content”：表示tooltip提示的内容指定已DOM格式插入到页面
（3）goToRout()：路由跳转方法
（4）toolTipContent：提示的内容信息
欢迎大家访问我的个人博客：http://blog.ycsn.xyz/

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^