Skip to content
广告位招租

优质广告位诚邀合作

本广告位曝光量正火速攀升,用户触达规模呈爆发式增长!现向品牌开放合作,趁曝光增长红利期,抓紧机会拿下,让您的品牌借势破圈!

--总浏览量(次)
--总计访客(人)

text v1.1.0

文本组件,默认情况下使用dict-text使用, 如果字典包配置中有配置componentsPreFix字段,请根据此字段的具体配置值进行前缀修改,如配置了componentsPreFixBu, 则使用bu-text使用。

复制成功
00:00
属性、事件和插槽继承技巧

此组件仅引用了van-tag一个组件,可直接继承原生属性、事件和插槽

点击阅读tag组件使用文档

组件结构

组件封装结构如下

vue
<van-tag ref="VanTextRef"></van-tag>
js
const VanTextRef = ref(null)
const getVanTextRef = () => {
  return VanTextRef.value
}

defineExpose({getVanTextRef})

仅使用了van-tag组件,因此可无缝继承van-tag组件的所有属性、事件及插槽。可使用getVanTextRef获取实例。

属性

继承van-tag组件的所有属性以及新增的下列几个属性

属性类型说明默认值
modelValuestring,number按钮绑定的字典值,必传,v1.1.0开始dictType没值时modelValue值就是tag标签值“”
dictTypestring按钮的字典类型,v1.1.0开始改为非必传“”
judgeTypeFun(modelValue)function根据modelValue返回对应的type函数
judgeColorFun(modelValue)function根据modelValue返回对应的color函数
judgeDisabledFun(modelValue)function根据modelValue返回对应的disabled函数
actionTypev1.1.0string点击时触发的事件类型可选值为 submitresetaction,用于动态组件触发提交或者重置或自定义的功能submit

注意

type优先级:judgeTypeFun > type > 字典值对应数据自带的的type属性

color优先级:judgeColorFun>color>字典值对应数据自带的color属性

disabled优先级:judgeDisabledFun>字典值对应数据自带的disabled属性(为false时忽略)>disabled

插槽

继承van-tag组件的所有插槽

微信公众号【爆米花小布】

0%

置顶

置顶