//html:
<div id="app">
  <p>{{msg}}<p>
</div> //script 需要引入jar包vue-2.4.0.js
<script>
  var vm = new Vue({
    el:'app'
    data:{
      msg:'hello,vue'
    }
  })
</sctipt>

说明:

p标签中的两个大括号 叫做 插值表达式,顾名思义就是 插入值用的

vue对象中的el 就是为了表示 new的这个vue对象是用来控制页面上的那个区域。

data中存放的是el中要使用到的数据。另外说一点 页面中需要用到的数据都需要在data中声明出来

vue不提倡我们操作dom节点。

vue学习(一)初步了解 vue实例的更多相关文章

  1. Vue学习记录第一篇——Vue入门基础

    前面的话 Vue中文文档写得很好,界面清爽,内容翔实.但文档毕竟不是教程,文档一上来出现了大量的新概念,对于新手而言,并不友好.个人还是比较喜欢类似于<JS高级程序设计>的风格,从浅入深, ...

  2. vue学习【二】vue结合axios动态引用echarts

    大家好,我是一叶,本篇是vue学习的第二篇,本篇将要讲述vue结合axios动态引用echarts. 在vue中,异步刷新使用的是axios,类似于大家常用的ajax,其实axios已经是vue的第二 ...

  3. 前端框架Vue------>第一天学习、Vue学习的路径、Vue官网(1)

    文章目录 1.学习目标 2.前端知识体系 2.1 前端三要素 2.2.MVVM 3.第一个Vue程序 4.Vue实例的生命周期 vue的官方文档:https://cn.vuejs.org/ 1.学习目 ...

  4. Vue学习第一天:Vue.js指令系统

    1. 如何使用Vue.js? 1.1 直接引入 - <script src="./statics/vue.min.js"></script> - 引入之后在 ...

  5. Vue学习笔记十三:Vue+Bootstrap+vue-resource从接口获取数据库数据

    目录 前言 SpringBoot提供后端接口 Entity类 JPA操作接口 配置文件 数据库表自动映射,添加数据 写提供数据的接口 跨域问题 前端修改 效果图 待续 前言 Vue学习笔记九的列表案例 ...

  6. vue学习【一】vue引用封装echarts并展示多个echarts图表

    大家好,我是一叶,经过一段时间对vue的学习,我打算把vue做一个系列,把踩过的坑和大家分享一下. 现在开始第一章:vue引用并封装echarts 在文章开始前,我先舔波echarts(真香).阿里的 ...

  7. Vue学习之--------组件在Vue脚手架中的使用(代码实现)(2022/7/24)

    文章目录 1.第一步编写组件 1.1 编写一个 展示学校的组件 1.2 定义一个展示学生的信息组件 2.第二步引入组件 3.制作一个容器 4.使用Vue接管 容器 5.实际效果 6.友情提示: 7.项 ...

  8. Vue学习系列(一)——初识Vue.js核心

    前言 vue.js是一套构建用户界面的渐进式框架,vue.js的目标是通过尽可能简单的API实现响应的数据绑定和组合的视图组件. vue通过DOM事件操作和指令来进行视图层和模型层的相互通讯,会为每一 ...

  9. Vue学习官网和Vue的书籍 目录结构

    Vue基础知识学习网站[中文] https://cn.vuejs.org/v2/guide/ Vue路由知识学习网站[中文] https://router.vuejs.org/zh/guide/  V ...

随机推荐

  1. 使用json-server与Mockjs搭建模拟服务

    为什么使用 在项目开发中,常常需要边写前端页面边写后端接口,但是后端接口服务往往是滞后于前端开发的,或者是不能及时提供的.出于前端开发的迅速和便捷去考虑,我们可以根据后端接口数据结构去模拟(mock) ...

  2. 线性dp 打鼹鼠

    鼹鼠是一种很喜欢挖洞的动物,但每过一定的时间,它还是喜欢把头探出到地面上来透透气的.根据这个特点阿Q编写了一个打鼹鼠的游戏:在一个n*n 的网格中,在某些时刻鼹鼠会在某一个网格探出头来透透气.你可以控 ...

  3. 入门大数据---Elasticsearch搭建与应用

    项目版本 构建需要: JDK1.7 Elasticsearch2.2.1 junit4.10 log4j1.2.17 spring-context3.2.0.RELEASE spring-core3. ...

  4. ceph SSD HDD分离与openstack调用

    本例子ceph L版本采用的是filestore,而不是bluestore. 一.查看class类型,只有一个hdd,.Luminous 为每个OSD添加了一个新的属性:设备类.默认情况下,OSD将根 ...

  5. Easy [还是概率DP思想……]

    题目描述 某一天\(WJMZBMR\)在打\(osu\)~~~但是他太弱逼了,有些地方完全靠运气\(QaQ\) 我们来简化一下这个游戏的规则 有\(n\)次点击要做,成功了就是\(o\),失败了就是\ ...

  6. Sql sever 声明变量,赋值变量

    语句: --声明变量DECLARE @idcard nvarchar () , @rowid nvarchar () --给变量赋值SELECT @idcard = '{0}', @rowid = ' ...

  7. 大厂程序员因厌恶编程,辞去月薪2w+的工作去当司机?

    世界好小啊,刚在一个 UP 主的群里看到一个视频,标题叫做:"失业了工作没找到,却稀里糊涂上了知乎热搜,2000 多万人围观,我--" 说实话,看到视频的封面,我的下巴当时就掉到了 ...

  8. centos6.4 卸载 vim7.2 安装vim7.4

    一.# rpm -qa|grep vim vim-minimal-7.2.-1.8.el6.x86_64 vim-enhanced-7.2.-1.8.el6.x86_64 vim-common-7.2 ...

  9. 每日一题 - 剑指 Offer 46. 把数字翻译成字符串

    题目信息 时间: 2019-07-02 题目链接:Leetcode tag: 动态规划 难易程度:中等 题目描述: 给定一个数字,我们按照如下规则把它翻译为字符串:0 翻译成 "a" ...

  10. Java入门基础学习,成为一个Java程序员的必备知识

    引言 众所周知,Java是一种面向对象的编程语言.您可以在Windows操作系统上编写Java源代码,而在Linux操作系统上运行编译后的字节码,而无需修改源代码. 数据类型 Java 有 2 种数据 ...