vue解决花括号数据绑定不成功的问题


Posted in Javascript onOctober 30, 2019

如下所示:

<!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解决花括号数据绑定不成功的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript获得选中文本内容的方法
Dec 02 Javascript
jQuery.fn和jQuery.prototype区别介绍
Oct 05 Javascript
Javascript冒泡排序算法详解
Dec 03 Javascript
javascript面向对象之定义成员方法实例分析
Jan 13 Javascript
jQuery实现可高亮显示的二级CSS菜单效果
Sep 01 Javascript
APP中javascript+css3实现下拉刷新效果
Jan 27 Javascript
三种Node.js写文件的方式
Mar 08 Javascript
浅析Bootstrap表格的使用
Jun 23 Javascript
setTimeout学习小结
Feb 08 Javascript
js, jQuery实现全选、反选功能
Mar 08 Javascript
浅谈react-router@4.0 使用方法和源码分析
Jun 04 Javascript
maptalks+three.js+vue webpack实现二维地图上贴三维模型操作
Aug 10 Javascript
vue中使用rem布局代码详解
Oct 30 #Javascript
vue进入页面时不在顶部,检测滚动返回顶部按钮问题及解决方法
Oct 30 #Javascript
Vue中图片Src使用变量的方法
Oct 30 #Javascript
解决VUE双向绑定失效的问题
Oct 29 #Javascript
vue-form表单验证是否为空值的实例详解
Oct 29 #Javascript
vue获取form表单的值示例
Oct 29 #Javascript
Vue 实现把表单form数据 转化成json格式的数据
Oct 29 #Javascript
You might like
《斗罗大陆》六翼天使武魂最强,为什么老千家不是上三宗?
2020/03/02 国漫
在普通HTTP上安全地传输密码
2007/07/21 PHP
通过curl模拟post和get方式提交的表单类
2014/04/23 PHP
Linux下php5.4启动脚本
2014/08/03 PHP
php实现的简单中文验证码功能示例
2017/01/03 PHP
CodeIgniter框架数据库基本操作示例
2018/05/24 PHP
TP5框架页面跳转样式操作示例
2020/04/05 PHP
js实现的日期操作类DateTime函数代码
2010/03/16 Javascript
Jquery easyui 下loaing效果示例代码
2013/08/12 Javascript
JQuery获取样式中的background-color颜色值的问题
2013/08/20 Javascript
js比较日期大小的方法
2015/05/12 Javascript
常用JS图片滚动(无缝、平滑、上下左右滚动)代码大全(推荐)
2016/12/20 Javascript
详解Vue2.0 事件派发与接收
2017/09/05 Javascript
Vuex 进阶之模块化组织详解
2018/01/12 Javascript
[05:13]TI4 中国战队 机场出征!!
2014/07/07 DOTA
利用Python的Django框架中的ORM建立查询API
2015/04/20 Python
Python实现针对中文排序的方法
2017/05/09 Python
Python requests库用法实例详解
2018/08/14 Python
在Python中实现替换字符串中的子串的示例
2018/10/31 Python
Linux下安装python3.6和第三方库的教程详解
2018/11/09 Python
python实现京东订单推送到测试环境,提供便利操作示例
2019/08/09 Python
python3.6中@property装饰器的使用方法示例
2019/08/17 Python
Python3如何对urllib和urllib2进行重构
2019/11/25 Python
python操作docx写入内容,并控制文本的字体颜色
2020/02/13 Python
浅谈Python中os模块及shutil模块的常规操作
2020/04/03 Python
python实现程序重启和系统重启方式
2020/04/16 Python
Python连接mysql方法及常用参数
2020/09/01 Python
Python unittest生成测试报告过程解析
2020/09/08 Python
英国复古服装和球衣购买网站:3Retro Football
2018/07/09 全球购物
创业计划书中要认真思考的问题
2013/12/28 职场文书
自荐信的格式
2014/03/10 职场文书
服务理念标语
2014/06/18 职场文书
2014县政府领导班子三严三实对照检查材料思想汇报
2014/09/26 职场文书
领导欢迎词范文
2015/01/26 职场文书
小学作文之描写天气
2019/08/15 职场文书
使用nginx配置访问wgcloud的方法
2021/06/26 Servers