<!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>Demo</title>

 </head>

 <body>

     <div id="app">

         app:{{name}}

     </div>

     <script src="https://cdn.bootcss.com/vue/2.5.16/vue.min.js"></script>

     <script>

         var vm = new Vue({

             el:'#app',

             data:{

                 name:'Vuejs',

             }

         });

     </script>

 </body>

1. div的id为app为vue的element元素，所有的vue操作只能在id为app下

2.实例化时，需要传入一个对象el（element）缩写，确定作用于那个div域下

3.data为参数命名与赋值，在指定的div下可以用{{}}俩个大括号包起来，来使该变量的值

说明：

1.引入的js链接通道：https://www.bootcdn.cn/vue/

2.没有开发环境的可以直接，在线代码调试：http://tool.chinaz.com/tools/webdebugger.aspx

vue.js 第一课：实例化vue的更多相关文章

  1. Js 框架之Vue .JS学习记录 ① 与Vue 初识

    目录 与 Vue.js 认识 VUE.JS是个啥?有啥好处? Vue 的目标 战前准备  VUE.JS环境 VUE.JS 尝试一下,你就明白 第一步 实例化VUE 对象 第二步VueAPP 调用数据 ...

  2. Vue.js是什么，vue介绍

    Vue.js是什么,vue介绍 Vue.js 是什么Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用. ...

  3. Vue.js 第1章 Vue常用指令学习

    今日目标 能够写出第一个vue应用程序 能够接受为什么需要学vue 能够使用指令 能够通过指定完成简单的业务(增加删除查询) 能够理解mvvm 为什么要学习vue 企业需要 可以提高开发效率 实现vu ...

  4. Vue.js系列(一)：Vue项目创建详解

    引言 Vue.js作为目前最热门最具前景的前端框架之一,其提供了一种帮助我们快速构建并开发前端项目的新的思维模式.本文旨在帮助大家认识Vue.js,并详细介绍使用vue-cli脚手架工具快速的构建Vu ...

  5. 【Vue.js实战案例】- Vue.js递归组件实现组织架构树和选人功能

    大家好!先上图看看本次案例的整体效果. 浪奔,浪流,万里涛涛江水永不休.如果在jq时代来实这个功能简直有些噩梦了,但是自从前端思想发展到现在的以MVVM为主流的大背景下,来实现一个这样繁杂的功能简直不 ...

  6. 【Vue.js游戏机实战】- Vue.js实现大转盘抽奖总结

    大家好!先上图看看本次案例的整体效果. 实现思路: Vue component实现大转盘组件,可以嵌套到任意要使用的页面. css3 transform控制大转盘抽奖过程的动画效果. 抽奖组件内使用钩 ...

  7. 【Vue.js游戏机实战】- Vue.js实现九宫格水果机抽奖游戏总结

    大家好!先上图看看本次案例的整体效果. 完整版实战课程附源码:[Vue.js游戏机实战]- Vue.js实现九宫格水果机抽奖 实现思路: Vue component实现九宫格水果机组件,可以嵌套到任意 ...

  8. 【Vue.js游戏机实战】- Vue.js实现老虎-机抽奖总结

    大家好!先上图看看本次案例的整体效果. 完整版实战课程附源码:[Vue.js游戏机实战]- Vue.js实现老虎-机抽奖 实现思路: Vue component实现老虎-机组件,可以嵌套到任意要使用的 ...

  9. Vue.js教程 2.体验Vue

    Vue.js教程 2.体验Vue <!DOCTYPE html> <html lang="en"> <head> <meta charse ...

随机推荐

  1. crazyradio焊接和下载固件过程

    非常早之前买过一套crazyradio的器件和空板.可是一直没有时间焊接出来,前天早上六点起来,安静的弄了一把,识别USB.下载crazyradio固件没问题,记录下过程: 1,首先是焊接,寻常的QF ...

  2. jni java与c++交互返回三维数组jobjectArray

    1.在java里创建一个类,在类里添加静态方法调用c++的类库dll,在java里创建要返回数组的函数.在java的main方法里创建返回后的测试方法. package cn.gov.cma.cnn. ...

  3. kali 2.0 linux中的Nmap的主机探测

    不多说,直接上干货! 如果是第一次接触Nmap,推荐在MSF终端中输入不加任何参数的Nmap命令,以查看其使用方法. 更多,其实, msf > nmap -h [*] exec: nmap -h ...

  4. Android中的Junit测试

    在开发中Junit测试可以很方便的帮助开者尽可能早的发现并处理问题,而且使用也非常简单,只需要导入Junit测试相关的jar包并创建测试类,就可以对业务功能进行测试,而不用为了测试在代码中添加输出语句 ...

  5. XRDP与VNC的关系（转载）

    XRDP与VNC的关系 如果仅仅安装XRDP协议.是不能在windows上使用远程桌面连接到Ubuntu. 还须要安装VNCServer才行. 所以,XRDP启动之后.系统会自己主动启动一个VNC会话 ...

  6. Haproxy实现web的页面的动静分离

    一.Haproxy概述: 概述:Haproxy是一个开源的高性能的反向代理或者说是负载均衡服务软件之一,由C语言编写而成,支持会话保持.七层处理.健康检查.故障修复后自动加载.动静分离.HAProxy ...

  7. 解决HMC在IE浏览器无法登录的问题（Java Applet的使用问题）

    管理IBM的小型机必须要用到HMC(Hardware Management Console),有时候在使用测试环境使用的时候我们会把HMC装到自己电脑上的虚拟机里面,然后管理小型机,但是在虚拟机里面使 ...

  8. KVM硬件辅助虚拟化之 EPT in Nested Virtualization

    在嵌套虚拟环境(Nested Virtualization)下,执行在hypervisor上的Virtual Machine仍能够作为hypervisor去执行其他的Virutal Machine,而 ...

  9. win32下实现透明窗体

    最開始写透明窗体的代码,在百度了之后,找到了SetLayeredWindowAttributes()这一个函数,可是因为网上案列的缺少,使得非常多人无法非常好的使用这一个方法,我花了几天的时间写了一个 ...

  10. Using a Plugin

    创建hello.world <?xml version="1.0"?> <sdf version="1.4"> <world na ...