一.Vue基本介绍

1.vue是渐进式的JavaScript框架

2.作者:尤雨溪(一位华裔前Google工程师)

3.作用:动态构建用户界面

二:Vue的特点

1.遵循MVVM模式(m->model(数据对象)   v->view(视图)  vm->view model)

2.编码简洁,体积小,运行效率高,适合移动端/PC端

3.它本身只关注UI,可以轻松引入Vue插件或其他第三方库开发项目

Vue扩展插件:

vue-cli:Vue脚手架

vue-resource(axios):ajax请求

vue-router:路由

vuex:状态管理

vue-lazyload:图片懒加载

vue-scroller:页面滑动相关

mint-ui:基于Vue的UI组件库(移动端)

element-ui:基于Vue的UI组件库(PC端)

三.Vue编写“Hello vue”

1.引入vue.js

2.创建vue对象

3.双向数据绑定

4.显示数据

代码展示:

<div id="app">
//3.双向数据绑定
<input type="text" v-model="username">
//4.显示数据
<p>Hello {{msg}}</p>
</div>
//1.引入vue.js
<script type="text/javascript" src="../js/vue.js"></script>
<script type="text/javascript">
//2.创建vue对象
var vm = new Vue({
el:"#app",
data:{
msg:'vue'
}
})

  

Vue框架是什么,有什么特点,怎么用的更多相关文章

  1. Vue框架Element的事件传递broadcast和dispatch方法分析

    前言 最近在学习饿了么的Vue前端框架Element,发现其源码中大量使用了$broadcast和$dispatch方法,而Element使用的是Vue2.0版本,众所周知在Vue 1.0升级到2.0 ...

  2. 使用vue框架运行npm run dev 时报错解决

    使用使用vue框架运行npm run dev 时报错 如下: 原因: localhost:8080 有可能其他软件占用了,导致其他问题的出现 我们可以动态修改地址 解决: 进入项目文件的config文 ...

  3. Vue框架下的node.js安装教程

    Vue框架下的node.js安装教程 python服务器.php  ->aphche.java ->tomcat.   iis -->它是一个可以运行JAVASCRIPTR 的运行环 ...

  4. Vue框架axios请求(类似于ajax请求)

    Vue框架axios get请求(类似于ajax请求) 首先介绍下,这个axios请求最明显的地方,通过这个请求进行提交的时候页面不会刷新 <!DOCTYPE html> <html ...

  5. Vue框架之双向绑定事件

    Vue框架之双向绑定事件 首先介绍下Vue框架的语法 vue通过 {{temp}} 来渲染变量 {{count+100}} # 求和 v-text # 为标签插入text文本 v-html # 为标签 ...

  6. Vue框架

    Vue框架 环境: windows python3.6.2 Vue的cdn: <script src="https://cdn.jsdelivr.net/npm/vue"&g ...

  7. vue框架入门和ES6介绍

    vue框架入门和ES6介绍 vue-mvvm模式,vue是一种轻量级的前端框架,主要为模板渲染,数据同步,组件化,模块化,路由等. https://cn.vuejs.org/ 源码:https://g ...

  8. 基于VUE框架 与 其他框架间的基本对比

    基于VUE框架的基本描述 与 其他框架间的基本对比 2018-11-03  11:01:14 A B React React 和 Vue 有许多相似之处,它们都有: 使用 Virtual DOM 提供 ...

  9. VUE框架的初识

    VUE框架的初识 初步了解Vue.js框架(渐进式前端框架) Vue.js是一种轻量级的前端MVVM框架.同时吸收了React(组件化)和Angular(灵活指令页面操作)的优点.是一套构建用户界面的 ...

  10. vue框架中的日期组件转换为yyy-mm-dd格式

    最近在用vue框架写一个app,这个是用到的日期格式转换,把下面的标准格式转换为字符串连接格式

随机推荐

  1. HTTP响应 状态码描述

  2. React子组件和父组件通信

    React子组件和父组件通信包括以下几个方面: 子组件获取父组件属性:props或者state 子组件调用父组件的方法 父组件获取子组件的属性:props或者state 父组件调用子组件的方法 我们从 ...

  3. 关于spark中DatatFrame函数操作中isin方法的使用

    需求: 1.需要从一张mysql数据表中获取并筛选数据 2.通过spark将该表读进来,形成一个df:DataFrame,有一个集合 val list = List[String]("小李& ...

  4. async-await用法

    转载:https://segmentfault.com/a/1190000011526612?utm_source=tag-newest

  5. 跟踪mqttv3源码(一)

    Spring整合MQTT pom.xml <!-- MQTT消息队列 --> <dependency> <groupId>org.eclipse.paho</ ...

  6. balcanced-binary-tree

    题目描述 Given a binary tree, determine if it is height-balanced. For this problem, a height-balanced bi ...

  7. APP压力稳定性测试之monkey环境搭建

    一.搭建adb环境: 需要的安装软件包可以使用我分享的,链接:https://pan.baidu.com/s/13DThDtc0GALabTakshcLfg 密码:0kuo:也可以自己百度下载 1)下 ...

  8. 算法面试题(python)——如何找出数组中出现一次的数

    题目描述: 一个数组里,除了三个数是唯一出现的,其余的数都出现了偶数次,找出这三个数中任意一个.比如数组序列为[1,2,4,5,6,4,2],只有1.5.6这三个数字是唯一出现的,数字2.4均出现了偶 ...

  9. Django基础-02

    django的介绍: Django 中提供了开发网站经常用到的模块,常见的代码都为你写好了,通过减少重复的代码,Django 使你能够专注于 web 应用上有 趣的关键性的东西.为了达到这个目标,Dj ...

  10. error: 'retain' is unavailable: not available in automatic reference counting. 解决办法

    报错原因是 项目使用的是ARC,但是有非ARC代码. 项目中要混合使用ARC和非ARC. 解决: target -> Build Phases -> Compile Sources 双击报 ...