美文网首页Web前端之路
vue.js指令,会在前面加上一个红星,也可以加其他的字符

vue.js指令,会在前面加上一个红星,也可以加其他的字符

作者: 竿牍 | 来源:发表于2019-08-01 19:51 被阅读2次

用途:表单中,有些是必填项,需要在选项前面加上一个红星,用指令很方便实现重用

Vue.directive('redStar', {
  inserted (el, binding) {
    let txt = el.innerHTML;
    el.innerHTML = `<span style="color: red;font-weight: bold;">${binding.value || '*'}</span>&nbsp;${txt}`;
  }
});
<span v-redStar>选择产品类型</span>

效果图:


image.png

相关文章

网友评论

    本文标题:vue.js指令,会在前面加上一个红星,也可以加其他的字符

    本文链接:https://www.haomeiwen.com/subject/dhzcdctx.html