• 使用 v-cloak 防止页面加载时出现 vue.js 的变量名


    知识点:使用 v-cloak 防止页面加载时出现 vue.js 的变量名

    场景:在使用vue语法,实现下拉框功能时,展示数据列表之前,出现对应的 vuejs 变量名

       

    代码:

    var vm = new Vue({
    el: '#demoVueList',
    data: {
    type_arr:[ //运送类型数组
    {ID:0,NAME:'循环运送'},
    {ID:1,NAME:'即时运送'}
    ]
    },

    });

    <label class="col-lg-1 col-form-label">
    运送类型
    </label>
    <select class="form-control m-input"
    style="height: 38px; 162px;" v-model="select.type"> <!--v-cloak-->
    <option v-for="option in type_arr" v-bind:value="option.ID">
    {{ option.NAME}}
    </option>
    </select>

    解决方案:

    css中添加:
    [v-cloak]{
    display: none;
    }


    v-cloak

    html标签中添加 :
    <select class="form-control m-input"
    style="height: 38px; 162px;" v-model="select.type" v-cloak>
    <option v-for="option in type_arr" v-bind:value="option.ID">
    {{ option.NAME}}
    </option>
    </select>

    加载时不会出现vue.js中的标签名了,一开始,文本框会隐藏,之后才会正常出现


    参考博客:https://www.sunzhongwei.com/hide-vuejs-variable-with-v-cloak-when-page-loading

  • 相关阅读:
    win8 tips
    从win10体验到重装win8
    win10 体验 日志
    磁盘分区与多系统安装(windows ubuntu)
    使用ultraISO制作ISO镜像文件
    C++中const用法总结
    4月8号的打卡
    Java第二次作业
    第一次Java作业
    NX二次开发-改变自制UI界面大小
  • 原文地址:https://www.cnblogs.com/shuaifing/p/10289291.html
Copyright © 2020-2023  润新知