vue 防止页面加载时看到花括号的解决操作
更新时间：2020年11月09日 14:12:36 作者：Quincy379
这篇文章主要介绍了vue 防止页面加载时看到花括号的解决操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
如下所示：
<style>
[v-cloak]{
display:none
}
</style>
v-cloak v-text v-html
v-cloak用于大段
v-text用于单个标签
v-html用于带有标签的处理
补充知识：vue花括号数据绑定不成功的问题
我就废话不多说了，大家还是直接看案例吧~
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script><!--引入vue-->
<script src="js/main.js" type="text/javascript" charset="utf-8"></script><!--引入main-->
<body>
<div id="app">
<p>{{message}}</p>
</div>
</body>
</html>
main.js如下图所示，只包含message信息，绑定到id为app的div上。
var app=new Vue({
el:'#app',
data:{
message:'hhh'
}
})
结果显示：
{{message}}
vue.js和自己写的js都在头部引用，并不能出现理想中的message信息。
更改一下引入顺序：
先引入vue.js——再写html内容——最后引入自己写的js代码。成功！原因暂时还不清楚，待日后填坑…
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<body>
<div id="app">
<p>{{message}}</p>
</div>
</body>
<script src="js/main.js" type="text/javascript" charset="utf-8"></script>
</html>
以上这篇vue 防止页面加载时看到花括号的解决操作就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
这篇文章主要介绍了vue-router如何实现history模式配置，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-06-06
这篇文章主要给大家介绍了关于vue3使用vue3-print-nb实现区域打印功能的相关资料,在日常操作中,相信很多人在Vue怎么用插件实现打印功能问题上存在疑惑,需要的朋友可以参考下2023-07-07
vue中v-if和v-for一起使用的弊端及解决办法(同时使用 v-if 和 v-for不
当 v-if 和 v-for 同时存在于一个元素上的时候，v-if 会首先被执行，这篇文章主要介绍了vue中v-if和v-for一起使用的弊端及解决办法,需要的朋友可以参考下2023-07-07
Vite是一个快速的构建工具,Vue3是一个流行的JavaScript框架,下面这篇文章主要给大家介绍了关于vite(vue3)配置内网ip访问的方法步骤,文中通过图文介绍的非常详细,需要的朋友可以参考下2023-05-05
这篇文章主要介绍了Antd form表单的使用、设值、取值、清空值方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-04-04
在vue中弹窗是常用的组件之一,可以用来展示警告、成功提示和错误信息等内容,这篇文章主要给大家介绍了关于如何使用Vue实现弹窗效果的相关资料,需要的朋友可以参考下2024-02-02
这篇文章主要给大家介绍了关于Vue中el-menu-item实现路由跳转的相关资料,文中通过实例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2022-09-09
这篇文章主要介绍了vue中实现动态生成二维码的方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-02-02
写一些纯前端的项目时,自己造数据有些麻烦,于是我们可以利用mock造一些简单的数据,来满足我们的需求,本文主要介绍了Vite+Vue3使用MockJS的实现示例,感兴趣的可以了解一下2024-01-01
Vue.sync修饰符与$emit(update:xxx)详解
这篇文章主要介绍了Vue.sync修饰符与$emit(update:xxx),实现思路非常简单，文章介绍了.sync修饰符的作用和使用.sync修饰符的写法，实现代码简单易懂对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2022-11-11
最新评论