首次写vue可能会出现:[Vue warn]: Cannot find element: #app

这是因为你的js在html页面头部引入的原因,自定义js文件要最后引入,因为要先有元素id,vue才能获取相应的元素。

示例:

1.index.js

var app = new Vue({
  el : '#app',
  data: {
    message: 'Hello Vue.js!'
  }
})

2.index.html

<html>
<head>
  <title>Vuejs</title>
</head>
<body>
  <div id="app">
    {{ message }}
  </div>
<script src="vue.js"></script>
<script src="index.js"></script>:这里自定js文件要在最后引入。
</body>
</html>

Vuejs学习笔记1的更多相关文章

  1. VueJs 学习笔记

    VueJs学习笔记 参考资料:https://cn.vuejs.org/ 特效库:TweenJS(补间动画库)  VelocityJS(轻量级JS动画库) Animate.css(CSS预设动画库) ...

  2. vuejs学习笔记(1)--属性,事件绑定,ajax

    属性 v-for 类似于angular中的 ng-repeat ,用于重复生成html片段: <ul id="box"> <li v-for="(v, ...

  3. vuejs学习笔记(2)--属性,事件绑定,ajax

    属性 v-for 类似于angular中的 ng-repeat ,用于重复生成html片段: <ul id="box"> <li v-for="(v, ...

  4. VueJs学习笔记

      在cmd下,进入目录之后 cd 到项目目录下 1 安装node cnpm install   2 启动或者调试 cnpm start (或是npm run dev) 3 上线: npm run b ...

  5. Vuejs学习笔记(一)

    1)    vue.js 的 主要功能 1.模板渲染 2.模块化 3.扩展功能:路由,Ajax 2)    vue.js 模板渲染之双向绑定示例 message 绑定到了 input 对象,所有在in ...

  6. vue.js 2.0 官方文档学习笔记 —— 01. vue 介绍

    这是我的vue.js 2.0的学习笔记,采取了将官方文档中的代码集中到一个文件的形式.目的是保存下来,方便自己查阅. !官方文档:https://cn.vuejs.org/v2/guide/ 01. ...

  7. Angular快速学习笔记(2) -- 架构

    0. angular 与angular js angular 1.0 google改名为Angular js 新版本的,2.0以上的,继续叫angular,但是除了名字还叫angular,已经是一个全 ...

  8. vue学习笔记(十)路由

    前言 在上一篇博客vue学习笔记(九)vue-cli中的组件通信内容中,我们学习组件通信的相关内容和进行了一些组件通信的小练习,相信大家已经掌握了vue-cli中的组件通信,而本篇博客将会带你更上一层 ...

  9. Vue学习笔记-Vue.js-2.X 学习(一)===>基本知识学习

    一  使用环境: windows 7 64位操作系统 二  IDE:VSCode/PyCharm 三  Vue.js官网: https://cn.vuejs.org/ 四  下载安装引用 方式1:直接 ...

随机推荐

  1. python2.7初学(〇)

    为什么学习Python Python为我们提供了非常完善的基础代码库,覆盖了网络.文件.GUI.数据库.文本等大量内容,被形象地称作“内置电池(batteries included)”.而且pytho ...

  2. 内核控制Meta标签:让360浏览器默认使用极速模式打开网页(转)

    为了让网站页面不那么臃肿,也懒的理IE了,同时兼顾更多的国内双核浏览器,在网页页头中添加了下面两行Meta控制标签. 1,网页头部加入 <meta name="renderer&quo ...

  3. 递推 HDU 2569

    考虑n-2 n-1 n z[n] 代表n个块 可行方案 1  n-2 和n-1 同 3*z[n-2] 2  n-2和n-1不同 2*(z[n-1]-z[n-2]); 减一减 然后可能是其中一种 *2 ...

  4. 进度条投票-W

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  5. Leetcode 75. Sort Colors

    Given an array with n objects colored red, white or blue, sort them so that objects of the same colo ...

  6. java 方法

    方法命名规范要求 类的命名规范:“全部单词的 首字母必须大写”.那么在定义方法的时候也是有命名规范要求的:“第 一个单词的首字母小写,之后每个单词的首字母大写”,那么这就是方法 的命名规范. 递归调用 ...

  7. AngularJS +HTML Demo

    <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="C ...

  8. css常用属性汇总

    一.常用css属性 (1) *block(区块) 行高 line-height:数值 | inherit | normal; 字间距 letter-spacing: 数值 | inherit | no ...

  9. 【转】sublime配置默认浏览器+多浏览器快捷键

    配置在Chrome,Firefox中打开 安装 SideBarEnhancements 然后通过ctrl + k, ctrl + b打开侧边栏,在侧边栏的文件中右击,找到 open width -&g ...

  10. 2 云计算系列之KVM的安装与使用

    preface 在上篇博客中,我们讲了云的概念,分类,以及虚拟化技术.我们知道Openstack的虚拟化技术是基于KVM的,所以下面就开始说说如何部署和使用KVM. 下面的讲解包含以下知识点: 安装K ...