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='https://www.haobala.com/bcjs/js/vue.js' type='text/javascript' charset='utf-8'></script><!--引入vue--> <script src='https://www.haobala.com/bcjs/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='https://www.haobala.com/bcjs/js/vue.js' type='text/javascript' charset='utf-8'></script> <body> <div id='app'> <p>{{message}}</p> </div> </body> <script src='https://www.haobala.com/bcjs/js/main.js' type='text/javascript' charset='utf-8'></script></html>
以上这篇vue 防止页面加载时看到花括号的解决操作就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持好吧啦网。
相关文章：
1. ASP.NET MVC解决上传图片脏数据的方法2. 删除docker里建立容器的操作方法3. js中textContent、innerText和innerHTML的用法以及区别4. openai createChatCompletion函数使用实例5. vue-element-admin中node-sass换成dart-sass,安装依赖报code 128多种问题的解决方法6. php面向对象程序设计介绍7. 在 .NET MAUI 中加载 json 文件的方法8. ASP.NET泛型二之泛型的使用方法9. .net core 3.1 Redis安装和简单使用10. 使用.net core 自带DI框架实现延迟加载功能
网公网安备