代码：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>vue入门</title>

    <script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>

</head>

<body>

  <div id="first">{{msg}}</div>

  <script>

      new  Vue({

        //绑定上面的id el指的是vue实例跟哪个dom节点绑定

        el:"#first",

        //挂载点

        data:{

          msg:"健身游泳了解一下"

        }

      })

  </script>

</body>

</html>

效果：

（1）通过

 el:"#first",
将与   id="first"的dom进行绑定、
（2）
data挂载点 与{{    }}里面的数据进行交互

2018-04-27    23:42:55

vue（1） 第一个例子的更多相关文章

  1. ElasticSearch 5学习(5)——第一个例子（很实用）

    想要知道ElasticSearch是如何使用的,最快的方式就是通过一个简单的例子,第一个例子将会包括基本概念如索引.搜索.和聚合等,需求是关于公司管理员工的一些业务. 员工文档索引 业务首先需要存储员 ...

  2. MXNet学习～第一个例子～跑MNIST

    反正基本上是给自己看的,直接贴写过注释后的代码,可能有的地方理解不对,你多担待,看到了也提出来(基本上对未来的自己说的),三层跑到了97%,毕竟是第一个例子,主要就是用来理解MXNet怎么使用. #导 ...

  3. emberjs学习一(环境和第一个例子)

    code { margin: 0; padding: 0; white-space: pre; border: none; background: transparent; } code, pre t ...

  4. Qt之QCustomPlot绘图（一）配置和第一个例子

    最近一个用Qt开发的项目需要绘制坐标曲线,我在老师的指点下使用了QCustomPlot这个插件,使用方法简单,功能还算不错. 可是在网上找了很多资料和博文都只是将官方提供的例子演示一遍,没有系统全面的 ...

  5. 键盘过滤第一个例子ctrl2cap（4.1~4.4）汇总，测试

    键盘过滤第一个例子ctrl2cap(4.1~4.4)汇总,测试 完整源代码 /// /// @file ctrl2cap.c /// @author wowocock /// @date 2009-1 ...

  6. springmvc的介绍和第一个例子

    SpringMVC是Spring 框架自带的一部分. SpringMVC底层基于:Servlet Struts2底层基于:filter struts1底层基于:Servlet spring 各模块 我 ...

  7. 04springMVC结构，mvc模式，spring-mvc流程，spring-mvc的第一个例子，三种handlerMapping，几种控制器，springmvc基于注解的开发，文件上传，拦截器，s

     1. Spring-mvc介绍 1.1市面上流行的框架 Struts2(比较多) Springmvc(比较多而且属于上升的趋势) Struts1(即将被淘汰) 其他 1.2  spring-mv ...

  8. mapReducer第一个例子WordCount

    mapreducer第一个例子,主要是统计一个目录下各个文件中各个单词出现的次数. mapper package com.mapreduce.wordCount; import java.io.IOE ...

  9. Informatica_(2)第一个例子

    PowerCenter Repository Manager1.启动客户端程序连接服务器打开客户端(PowerCenter Repository Manager)PCRM;存储库--配置域--添加新域 ...

  10. GLSL着色语言学习。橙皮书第一个例子GLSL+OpenTK+F#的实现。

    Opengl红皮书有选择的看了一些,最后的讲着色语言GLSL的部分看的甚为不理解,然后找到Opengl橙皮书,然后就容易理解多了. 在前面,我们或多或少接触到Opengl的处理过程,只说前面一些处理, ...

随机推荐

  1. JUC源码分析-线程池篇（一）：ThreadPoolExecutor

    JUC源码分析-线程池篇(一):ThreadPoolExecutor Java 中的线程池是运用场景最多的并发框架,几乎所有需要异步或并发执行任务的程序都可以使用线程池.在开发过程中,合理地使用线程池 ...

  2. Apache配置 PHP 支持

    1,在服务区安装PHP 解压 php 到纯英文路径目 2,添加 PHP处理模块 LoadModule php7_module C:/ProgramData/php/php7apache2_4.dl 3 ...

  3. Xn数列

     题目描述 Description 给你6个数,m, a, c, x0, n, g Xn+1 = ( aXn + c ) mod m,求Xn m, a, c, x0, n, g<=10^18 输 ...

  4. autocomplete调用接口数据实现

    开发中遇到需要对大量数据实时搜索,频繁调取api产生的问题记录 1.每输入一个字符,就向后端发一次请求.当输入完一个人名的时候,就已经向后端发送了好多条请求,太多的请求会给服务器带来压力,其实在实时搜 ...

  5. Mysql 查询表中某字段的重复值，删除重复值保留id最小的数据

    1 查询重复值 ); 2 删除重复值 -- 创建临时表 ) ); -- 把重复数据放进临时表 INSERT Hb_Student_a SELECT id,studentNumber FROM Hb_S ...

  6. [转]Netty入门(最简单的Netty客户端/服务器程序)

    Java中的NIO是一种解决阻塞式IO问题的基本技术,但是NIO的编写对java程序员是有比较高的要求的.那么Netty就是一种简化操作的一个成熟的网络IO编程框架.这里简单介绍一个程序,代码是< ...

  7. Mac电脑如何转换图片格式？ImageWell for Mac转换图片格式教程

    想用Mac电脑转换图片格式?我想你可以借助ImageWell for Mac软件!ImageWell是一款简单好用的的图像处理工具,具有显示,编辑,处理,保存等功能.下面小编来为大家演示在Mac电脑上 ...

  8. leetcood学习笔记-111-二叉树的最小深度

    题目描述: 第一次提交: class Solution(object): def minDepth(self, root): """ :type root: TreeNo ...

  9. leetcood学习笔记-101-对称二叉树

    题目描述: 方法一:递归: class Solution: def isSymmetric(self, root: TreeNode) -> bool: if not root: return ...

  10. Dart编程数据类型

    编程语言最基本的特征之一是它支持的数据类型集.这些是可以用编程语言表示和操作的值的类型. Dart语言支持以下类型 数字 字符串 布尔 列表list map 数字 Dart中的数字用于表示数字文字.D ...