前端--vue框架
1、下载
查看已安装好的版本
-------渐进式的JS框架---------
vue是什么
Vue.js（读音 /vjuː/, 类似于 view） 是一套构建用户界面的 渐进式框架。与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计。 Vue 的核心库只关注视图层，并且非常容易学习，非常容易与其它库或已有项目整合。另一方面，Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。 Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。 如果你是有经验的前端开发者，想知道 Vue.js 与其它库/框架的区别，查看对比其它框架。
引入vue格式(网址引入)：
// 实例化vue对象
new Vue({
el:"#vue-app"
data:{
name:"miss wu"
}，
methods:{
},
watch:{
} }); el:element 需要获取的元素，一定是html中的跟容器元素
data：用于数据的存储 methods:用于存储各种方法
watch:{}：数据监听
一个简单的实例
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link href="styles.css" rel="stylesheet" />
<script src="https://unpkg.com/vue"></script>
</head>
<body>
<div id="app">
<h1>{{ message }}</h1>
{{job}}
<p>{{greet('today')}}</p>
</div> <script src="app.js">
</script>
</body>
</html>
app.js
var app = new Vue({
el: '#app',
data: {
message: 'Hello Vue!',
job:'admin'
},
methods:{
greet:function (time) {
return 'Good'+'\n'+time+"!"+'....'+this.job
}
}
});
-----------------------
vue的属性和方法
双击鼠标事件：
模板指令： html和vue对象的粘合剂
数据渲染：v-text、v-html 、{{}}
控制模板 隐藏：v-if、v-show
渲染循环列表：v-for---展现之后第一行是apple，第二行是banana
事件绑定：v-on
属性绑定：v-bind
小结：
v-text="title"等价于{{title}}
前端--vue框架的更多相关文章
- 前端vue框架 脚手架
1.安装node.js最新版本2.cmd下输入 1.node -v得到版本号检测是否安装成功 版本号要在6.9以上 2.npm -v 版本号要在3.10以上3.安装脚手架 1.npm install ...
- 前端VUE框架
一.什么是VUE? 它是一个构建用户界面的JAVASCRIPt框架 vue不关心你页面上的是什么标签,它操作的是变量或属性 为什么要使用VUE? 在前后端分离的时候,后端只返回json数据,再没有 ...
- ABP实践(4)-abp前端vue框架之简单商品增删改查(帮助刚入门的新手快速了解怎么才能加入自己的功能并运行起来)
提示:如有不明白的地方请先查看前3篇ABP实践系列的文章 1,下载及启动abp项目前后端分离(netcore+vue) 2,修改abp数据库为mysql 3,商品系列api接口(本文主要依赖在这个商品 ...
- 前端vue框架 路由的安装及使用
安装: 1.cmd下输入: npm install vue-router --save //安装路由 2.npm run dev //重新启动 使用: 1.在mian.js下引入路由 import V ...
- 前端Vue框架-vuex状态管理详解
新人报道!多多关照-多提宝贵意见 谢谢- vuex理解 采用集中式存储管理模式.用来管理组件的状态,并以自定义规则去观测实时监听值得变化. 状态模式管理理解 属性 理解 state 驱动应用的数据源 ...
- 前端vue框架 父组件与子组件之间的相互调用
子组件调用父组件东西: 1.在父组件与子组件契合的标签的的template模板中绑定 v-bind:自定义一个名字=“要调用的名字” 2.在子组件的script中props:["自定义的名字 ...
- 前端VUE框架-es6
EMCAScript 6 又叫 es2015 1.常量和变量 常量: const a = "hello" 常量不能修改和重复定义 变量: let:定义一个块级作用域的变量 需要先定 ...
- Vue 浅谈前端js框架vue
Vue Vue近几年来特别的受关注,三年前的时候angularJS霸占前端JS框架市场很长时间,接着react框架横空出世,因为它有一个特性是虚拟DOM,从性能上碾轧angularJS,这个时候,vu ...
- 前端mv框架下（目前写的是vue），对组件抽象的思考
前沿: 抽象是门大学问.前端mv框架中,以组件化的概念为主.经常会考虑抽象到组件级别,进行复用.合理的抽象,能提高效率,减少业务逻辑视图的耦合程度.不合理的抽象,则会增加代码的复杂程度. 遇到的问题 ...
随机推荐
- centos7.3 64位 安装git
1.安装编译git时需要的包 # yum install curl-devel expat-devel gettext-devel openssl-devel zlib-devel # yum ins ...
- VS Code + NWJS（Node-Webkit）0.14.7 + SQLite3 + Angular6 构建跨平台桌面应用
一.项目需求 最近公司有终端桌面系统需求,需要支持本地离线运行(本地数据为主,云端数据同步),同时支持Window XP,最好跨平台.要求安装配置简单(一次性打包安装),安装包要小,安装时间短,可离线 ...
- 5.移动终端App测试点归纳
以下所有测试最后必须在真机上完整的执行. 1 安装.卸载测试 1.1 在真机上.第三方软件(xy苹果助手.91.安卓助手)的安装与卸载 1.2 安装在手机卡上 或 SD卡上 (不同的IOS和安卓版本) ...
- 使用ssh免密登录
在开发中经常会遇到远程登录服务器,要经常输入密码.有时密码太复杂记不住,还需要保存到本地文件中. 可以使用ssh命令,配置密钥登录,这样就不需要输入密码,一劳永逸,何乐而不为 ^--^ 配置密钥只需要 ...
- N!分解质因子p的个数_快速求组合数C(n,m)
int f(int n,int p) { ) ; return f(n/p,p) + n/p; } https://www.xuebuyuan.com/2867209.html 求组合数C(n,m)( ...
- Python全栈之路----数据类型—列表
1.列表是一个数据的集合,集合内可以放任何数据类型,可对集合进行方便的增删改查操作.列表里面的数可以重复. L1 = [ ] #定义空列表 L2 = [ 'a' , 'b' , 'c' , 'd' ] ...
- C# 比较两个路径是否指向同一对象
string path1 = @"c:\test\rootpath"; string path2 = @"C:\TEST\..\TEST\ROOTPATH"; ...
- centos7生产环境下openssh升级
由于生产环境ssh版本太低,导致使用安全软件扫描时提示系统处于异常不安全的状态,主要原因是ssh漏洞.推荐通过升级ssh版本修复漏洞 因为是生产环境,所以有很多问题需要注意.为了保险起见,在生产环境下 ...
- 将文件夹下的所有csv文件存入数据库
# 股票的多因子分层回测代码实现 import os import pymysql # import datetime, time # from config import * database_ta ...
- django基础 -- 10.form , ModelForm ,modelformset
一.生成页面可用的 HTML标签 1.form 所有内置字段 Field required=True, 是否允许为空 widget=None, HTML插件 label=None, 用于生成Label ...