vue初级使用
一、Vue是什么?
Vue（读音 /vjuː/, 类似于 view）是一个构建数据驱动的 web 界面的渐进式框架。采用自底向上增量开发的设计。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。
Vue渐进式的理解:http://www.bslxx.com/a/vue/2017/1205/1490.html
Vue只关注视图层。
Vue通过新的属性（自定义）和{{表达式}}扩展了 HTML。
Vue的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。
Vue学习起来非常简单。
二、Vue特性
l 轻量
Vue.js库的体积非常小的，并且不依赖其他基础库。
l 数据绑定
对于一些富交互、状态机类似的前端UI界面，数据绑定非常简单、方便。
l 指令
内置指令统一为(v-*)，也可以自定义指令，通过对应表达值的变化就可以修改对应的DOM。
l 插件化
Vue.js核心不包含Router、AJAX、表单验证等功能，但是可以非常方便地根据需要加载对应插件。
l 组件化
组件可以扩展 HTML 元素，封装可重用的代码。允许我们使用小型、自包含和通常可复用的组件构建大型应用
l 兼容性
Vue 不支持 IE8 及以下版本，因为 Vue 使用了 IE8 无法模拟的 ECMAScript 5 特性。但它支持所有兼容 ECMAScript 5 的浏览器。
三、Vued的使用：
它有两个版本：开发版本和生产版本（由于代码太多，具体的vue.js文件需要到vue官网复制）。
<!-- 引入vue开发版文件 -->
<script type="text/javascript" src="js/vue/vue.js"></script>
四、Vue实例讲解
1、vue实例挂在（el）的标签
每个Vue实例通过el配置挂载的标签，该标签可以通过id或者是class挂载。 实例上的属性和方法只能够在当前实例挂载的标签中使用
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="app">
<h3> {{messge}}</h3>
姓名：{{user.name}}；年龄：{{user.age}}；性别：{{user.sex}}
</div>
<!--开发版本(项目上线之后要替换成生产版本)；生产版本：vue.min.js-->
<script type="text/javascript" src="js/vue.js" ></script>
<script type="text/javascript">
var app=new Vue({
el:"#app",
data:{
messge:"变形金刚",
user:{
name:"张三",
age:18,
sex:"男"
}
}
});
// 通过Vue实例可以直接修改data对象中的数据
app.messge="修改后的变形金刚";
app.user.name="王小二";
</script>
</body>
</html>
2、Vue中的数据(data)
1 、Vue实例的数据保存在配置属性data中, data自身也是一个对象.
2、通过Vue实例直接访问和修改data对象中的数据,及时同步的页面上
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="app">
<h3> {{messge}}</h3>
</div>
<div class="cla">
<h3> {{messge}}</h3>
</div>
<!--开发版本(项目上线之后要替换成生产版本)；生产版本：vue.min.js-->
<script type="text/javascript" src="js/vue.js" ></script>
<script type="text/javascript">
var app=new Vue({
el:"#app",
data:{
messge:"变形金刚"
}
}); var ha= new Vue({
el:".cla",
data:{
messge:"搬砖的程序员"
}
});
</script>
</body>
</html>
3、Vue中的方法(methods)
1、Vue实例的方法保存在配置属性methods中,methods自身也是一个对象. 该对象中值都是方法体
2、方法都是被Vue对象调用,所以方法中的this代表Vue对象
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="app">
<h3> {{messge}}</h3>
{{haa()}}
</div>
<!--开发版本(项目上线之后要替换成生产版本)；生产版本：vue.min.js-->
<script type="text/javascript" src="js/vue.js" ></script>
<script type="text/javascript">
var app=new Vue({
el:"#app",
data:{
messge:"变形金刚",
user:{
name:"张三",
age:18,
explain:"过来啊！"
}
},
methods:{
//方法写法一：
haa:function(){
return this.user.name+this.user.explain+"我请你吃糖果";
},
//方法写法二：
yaa(){
//跳出一个弹窗
alert(this.messge+"是钢铁直男");
}
}
});
app.yaa();
</script>
</body>
</html>
4、vue数据双向绑定
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="app">
<!--监听input中值的改变同步到data中的message上:
v-model:数据的绑定；
将app对象中的message值绑定到input中，同时输入input值后，也作用于app的message值。
-->
<h3> {{messge}}</h3>
<input type="text" v-model="messge" />
</div>
<!--开发版本(项目上线之后要替换成生产版本)；生产版本：vue.min.js-->
<script type="text/javascript" src="js/vue.js" ></script>
<script type="text/javascript">
var app=new Vue({
el:"#app",
data:{
messge:"变形金刚",
}
}); </script>
</body>
</html>
五、Vue架构的认识：
Vue是一款开源的JavaScript MV*（MVVM、MVC）框架。
Vue引入了MVVM (Model-View-ViewModel)模式，他不同于MVC架构.
MVC模式：
Model： 数据模型，一些JavaScript 对象，比如 {name : "小小强",age : 16};
View: 视图，网页中的内容，一般由HTML模板生成。
Controller : 控制器（路由），视图和模型之间的胶水。
MV VM模式：
Model：它是与应用程序的业务逻辑相关的数据的封装载体，它是业务领域的对象，Model并不关心会被如何显示或操作，所以模型也不会包含任何界面显示相关的逻辑。在web页面中，大部分Model都是来自Ajax的服务端返回数据或者是全局的配置对象。
View：它专注于界面的显示和渲染，在Vue中则是包含一堆声明式Directive和Component的视图模板。
ViewModel：它是View和Model的粘合体，负责View和Model的交互和协作，它负责给View提供显示的数据，以及提供了View中Command事件操作Model的途径；在vue中“Vue对象实例”充当了这个ViewModel的角色；
View不能直接与Model交互，而是通过Vue实例这个ViewModel来实现与Model的交互。对于界面表单的交互，通过v-model指令来实现View和ViewModel的同步。对于View而言，ViewModel中的DOM Listeners工具会帮助我们监听页面上DOM元素的变化，一旦发生变化，Model中的数据也会发生改变；
对于Model而言，当我们添加或修改Model中的数据时，ViewModel中的Data Bindings工具会帮助我们更改View中的DOM元素。从而实现View和Model的分离，达到对前端逻辑MVVM的分层架构。
六、VueJS表达式
语法：
VueJS表达式写在双大括号内：{{ expression }}。
VueJS表达式把数据绑定到 HTML。
VueJS将在表达式书写的位置"输出"数据。
VueJS表达式 很像 JavaScript 表达式：它们可以包含文字、运算符和变量。
实例 {{ 5 + 5 }}
或 {{ firstName
+ " " + lastName }}
案例：
1、简单表达式
在{{ }}中可以进行简单的运算
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body> <div id="app">
<!--简单表达式 -->
<h1>{{5+5}}</h1>
<!-- +:运算，字符串连接 -->
<h1>{{5+"v5"}}</h1>
<h1>{{5+"5"}}</h1>
<!-- -：减法 -->
<h1>{{"5"-"5"}}</h1>
<h1>{{5*5}}</h1>
<!-- *:乘 法 -->
<h1>{{"5"*"5"}}</h1>
<!-- / 除法-->
<h1>{{5/5}}</h1>
<h1>{{5/5}}</h1> </div>
<!--开发版本(项目上线之后要替换成生产版本)；生产版本：vue.min.js-->
<script type="text/javascript" src="js/vue.js" ></script>
<script type="text/javascript">
var app=new Vue({
el:"#app"
}); </script>
</body>
</html>
2、三目表达式
在{{}}中的表达式可以使用三元运算符,但是不能够使用其他语句
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="app">
<!--三目运算 -->
{{ show?"真":"假"}}
</div>
<!--开发版本(项目上线之后要替换成生产版本)；生产版本：vue.min.js-->
<script type="text/javascript" src="js/vue.js" ></script>
<script type="text/javascript">
var app=new Vue({
el:"#app",
data:{
show:true,
}
}); </script>
</body>
</html>
3、字符串表达式
1、直接使用字符串字面值作为字符串对象
2、使用data中的字符串对象
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="app">
{{"这是字面值"}}<br/>
{{"这是字面值".length}}<br/>
{{message.length}}<br/>
<!--从字符串索引1开始获取，到索引5之前结束-->
{{message.substring(1,5)}}<br/>
<!--从字符串索引2开始获取，到索引6之前结束；toUpperCase():将小写变为大写-->
{{message.substring(2,6).toUpperCase()}}<br/>
<!--substr(index,length):从index开始截取，截取length个字符串 -->
{{message.substr (1,3)}}<br/>
</div>
<!--开发版本(项目上线之后要替换成生产版本)；生产版本：vue.min.js-->
<script type="text/javascript" src="js/vue.js" ></script>
<script type="text/javascript">
var app=new Vue({
el:"#app",
data:{
message:"我在data里面"
}
});
</script>
</body>
</html>
4、对象表达式
在表达式中可以使用data中定义的对象的各种用法.像使用js对象中的方法和属性一样
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="app">
{{messge}}<br/>
{{JSON.stringify(messge)}}<br/>
{{messge.toString()}}<br/>
{{messge.name}}<br/>
{{messge.age}}<br/>
{{messge.getAge()}}<br/>
</div>
<!--开发版本(项目上线之后要替换成生产版本)；生产版本：vue.min.js-->
<script type="text/javascript" src="js/vue.js" ></script>
<script type="text/javascript">
var user ={
name:"张三",
age:19,
getAge:function(){
return this.age;
},
toString:function(){
return "姓名:"+this.name+",年龄:"+this.age;
}
}
var app=new Vue({
el:"#app",
data:{
messge:user
}
}); </script>
</body>
</html>
5、数组表达式
在表达式中可以使用JavaScript数组中的任何语法来操作数组.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="app">
{{hobbys}}<br/>
{{hobbys[0]}}<br/>
{{hobbys.length}}<br/>
{{hobbys.toString()}}<br/>
<!--用“-----”将每个元素分隔开显示-->
{{hobbys.join("------")}}<br/>
</div>
<!--开发版本(项目上线之后要替换成生产版本)；生产版本：vue.min.js-->
<script type="text/javascript" src="js/vue.js" ></script>
<script type="text/javascript">
var app=new Vue({
el:"#app",
data:{
hobbys:["打游戏","踢足球",'看电视',"游泳"]
}
});
</script>
</body>
</html>
七、Vue指令
1、什么是指令
指令是一个带有v-前缀的特殊标签属性, 指令属性的值预期是单个JavaScript表达式.
2、常见的指令
v-text=“表达式” 设置标签中的文本
v-html=“表达式” 设置标签中的html
v-if=“表达式” 判断条件
v-for=“表达式” 循环
v-model=“表达式” 数据双向绑定
v-on=“表达式” 注册事件
3、指令的作用
1、作用: 当表达式的值改变时，将其产生的连带影响，响应式地作用于 DOM。
2、一个标签元素上可以出现多个指令属性
3、指令只能够出现在Vue对象所挂载的标签范围内的标签中
4、v-text指令
注意事项:
1、如果值是html的值,也不会作为普通的文本使用.
2、标签中的属性值必须是data中的一个属性.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="app">
<span v-text="message"></span><br/>
<span v-text="user.username"></span><br/>
</div>
<!--开发版本(项目上线之后要替换成生产版本)；生产版本：vue.min.js-->
<script type="text/javascript" src="js/vue.js" ></script>
<script type="text/javascript">
var app=new Vue({
el:"#app",
data:{
message: "<h1>这是一个Span!</h1>",
user: {
username: "李李"
},
}
});
</script>
</body>
</html>
5、v-html指令
注意事项:
1、{{表达式}} 可以插入的标签的内容中
2、v-text和v-html更改标签中的所有内容
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="app">
<!--将message的值解析为html来执行-->
<div v-html="message"></div>
</div>
<!--开发版本(项目上线之后要替换成生产版本)；生产版本：vue.min.js-->
<script type="text/javascript" src="js/vue.js" ></script>
<script type="text/javascript">
var app=new Vue({
el:"#app",
data:{
message: "<h1>这是一个Html!</h1>",
}
});
</script>
</body>
</html>
6、v-for指令
数组：
1、v-for="元素 in 数组"（v-for="ele in arr"）
2、v-for="(元素,索引) in 数组"（v-for="(ele,index) in arr"）
对象：
1、v-for="值in 对象"（v-for="value in obj"）
2、v-for="(值,键) in 对象"（v-for="(value,key) in obj"）
3、v-for=(值,键,索引) in 对象（v-for=(value,key,index) in obj）
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="app">
<h1>循环数组</h1>
<ul>
<li v-for="hobby in hobbys">{{hobby}}</li>
</ul>
<h1>遍历对象</h1>
<ul>
<li v-for="value in student">{{value}}</li>
</ul> <h1>带索引循环数组</h1>
<ul>
<li v-for="(hobby,index) in hobbys">{{index}}--{{hobby}}</li>
</ul>
<h1>带键遍历对象</h1>
<ul>
<li v-for="(value,key,index) in student">{{index+1}}---{{key}}--{{value}}</li>
</ul>
</div>
<!--开发版本(项目上线之后要替换成生产版本)；生产版本：vue.min.js-->
<script type="text/javascript" src="js/vue.js" ></script>
<script type="text/javascript">
var app=new Vue({
el:"#app",
data:{
hobbys : ["爬山","游泳","打豆豆","睡觉"],
student : {
name: "小毛",
age: 2,
sex: "男",
},
num : 10,
str : "itsource",
}
}); </script>
</body>
</html>
7、v-bind指令
1、v-bind:属性名="表达式"（v-bind:src=”路径”简写：src=”路径”）
2、v-bind=”对象”
注意：
将一个对象 键 和 值 作为标签的属性的名字和值时,在v-bind后不需要指定属性的名字
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--
v-bind指令
作用：将html的属性和Vue实例data值绑定到一起
语法1:
v-bind:属性名="表达式"
语法2:
:属性名="表达式" 语法3:
v-bind="对象"
-->
<div id="app">
<iframe v-bind:src="src"></iframe><br />
<iframe :src="src"></iframe><br />
<!--<iframe src="http://www.baidu.com" class="myIframe"></iframe>-->
<!--<iframe v-bind="attr"></iframe>-->
<iframe :src="attr.src" :class="attr.class"></iframe><br />
</div>
<!--开发版本(项目上线之后要替换成生产版本)；生产版本：vue.min.js-->
<script type="text/javascript" src="js/vue.js" ></script>
<script type="text/javascript">
var app=new Vue({
el:"#app",
data:{
src:"http://www.baidu.com",
attr:{
src:"http://www.baidu.com",
class:"myIframe"
}
}
}); </script>
</body>
</html>
8、v-model指令
1、v-model只作用于以下表单:
input、 select、 textarea
注意：在input标签中，当v-model和value属性都存在的时候，在前台页面上展示的是v-model的值，但value的值却没有改变，提交表单时提交的还是value值。
复选框v-mode表达式的值为一个数组。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="app">
<input v-model="message" value="这是value值" /><br />
爱好:
<input type="checkbox" v-model="hobby" value="1"/>唱
<input type="checkbox" v-model="hobby" value="2"/>跳
<input type="checkbox" v-model="hobby" value="3"/>rap
性别
<input type="radio" v-model="sex" value="1"/>man
<input type="radio" v-model="sex" value="2"/>woman
</div>
<!--开发版本(项目上线之后要替换成生产版本)；生产版本：vue.min.js-->
<script type="text/javascript" src="js/vue.js" ></script>
<script type="text/javascript">
var app=new Vue({
el:"#app",
data:{
message:"dbl",
hobby:[1,2],
sex:2
}
});
</script>
</body>
</html>
9、v-show指令
<标签名 v-show="真假表达式"></标签名>
如果v-show="真",标签中添加display:none样式
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="app">
<!--
v-show:
语法：
v-show="真假表达式"
如果表达式为假,相当于是在这个标签上添加css样式:display:none(相当于隐藏了)
-->
<p v-show="isShow">我是07</p>
</div>
</div>
<!--开发版本(项目上线之后要替换成生产版本)；生产版本：vue.min.js-->
<script type="text/javascript" src="js/vue.js" ></script>
<script type="text/javascript">
var app=new Vue({
el:"#app",
data:{
isShow:true
}
});
</script>
</body>
</html>
10、v-if指令
<标签名 v-if="表达式"></标签名>
<标签名 v-else-if="表达式"></标签名>
<标签名 v-else-if="表达式"></标签名>
<标签名 v-else></标签名>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="app">
<p v-if="money<10">中午不吃饭</p>
<p v-else-if="money>=10&&money<20">吃牛肉面</p>
<p v-else>吃拉面</p>
</div>
<!--开发版本(项目上线之后要替换成生产版本)；生产版本：vue.min.js-->
<script type="text/javascript" src="js/vue.js" ></script>
<script type="text/javascript">
var app=new Vue({
el:"#app",
data:{
money:15
}
}); </script>
</body>
</html>
八、事件
v-on:事件名称="表达式或者vue函数的调用"(例如：v-on:click="方法名()")
简写：@事件名称
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="app">
<button @click="clickMe(1)">点我试试</button>
<button @click="clickMe(2)">点我试试</button>
</div>
<!--开发版本(项目上线之后要替换成生产版本)；生产版本：vue.min.js-->
<script type="text/javascript" src="js/vue.js" ></script>
<script type="text/javascript">
var app=new Vue({
el:"#app",
data:{
money:15
},
methods:{
clickMe(num){
alert(num)
}
}
});
</script>
</body>
</html>
九、综合练习
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>vue综合练习</title>
<style type="text/css">
td{
align-content: center;
}
</style>
</head>
<body>
<div id="app">
<h3>购物车</h3>
<h4 v-if="products.length==0">空空如也</h4>
<div v-else>
<table border="1" cellspacing="0" align="center">
<tr>
<th>编号</th>
<th>商品名称</th>
<th>商品价格</th>
<th>商品数量</th>
<th>操作</th>
</tr>
<tr v-for="(product,index) in products">
<td>{{index+1}}</td>
<td>{{product.name}}</td>
<td>{{product.price}}</td>
<td><button @click="reduce(index)">-</button>{{product.num}}<button @click="add(index)">+</button></td>
<td><button @click="del(index)">删除</button></td>
</tr
<tr>
<td colspan="5">总价：{{total}}</td>
</tr>
</table>
</div>
</div>
<script type="text/javascript" src="js/vue.js" ></script>
<script>
var app = new Vue({
el: "#app",
data: {
products:[
{id:1,name:"西瓜",price:20.00,num:4},
{id:2,name:"牛奶",price:30.00,num:2},
{id:3,name:"榴莲",price:80.00,num:1}
],
total:0
},
methods:{
//新版本写法：del(){}
//删除商品
del:function(index){
this.count();
this.products.splice(index,1);
},
//商品数量增加
add:function(index){
this.count();
this.products[index].num++;
},
//商品数量减少
reduce:function(index){
this.count();
//购物车中一种商品的数量至少为1个
if(this.products[index].num>1) {
this.products[index].num--;
}
},
//计算商品总价格
count:function(){
this.total=0;
for(var i in this.products){
this.total+=this.products[i].price*this.products[i].num;
}
}
},
//最后运行
mounted(){
this.count();
}
}); </script>
</body>
</html>
vue初级使用的更多相关文章
- vue初级学习--组件的使用(自定义组件)
一.导语 突然冒出四个字,分即是合,嗯,优点道理....................... 二.正文 在搞的仿淘宝demo,之前加入购物车是与商品详情一块的,今天把它单独拆出来,复用性高点,那这样 ...
- vue初级学习--路由router的编写（resolve的使用）
一.导语 最近在用vue仿写淘宝的商品详情页面以及加入购物车页面,若是成功了,分享给大家~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 二.正文 我先用控制台创建了vue项目demo(如 ...
- vue初级学习--控制台创建vue项目
一.导语 困困的我,好想睡啊,但还是敲下这边有的没的的笔记吧 二.正文 1.输入 vue list 可查看此环境下,vue能创建的项目模板 没将webpack.vue-route啃精了的话,老实用we ...
- vue初级学习--idea的环境搭建
一.导语 最近接触了下idea,虽然我对于各种"代码界的神器"没有多大感冒,一个eclipse或者myeclipse,一个Notepad++ .一个就可以把我征服,但还是蛮喜欢id ...
- vue初级学习--环境搭建
一.导语 最近总想学点东西,es6啊.typescript啊,都想学,刚好有个机遇,可以学点vue,嗯,那就开始吧. 二.正文 1.node环境: 下载安装nodeJs,最好是1.6以上的版本,下载地 ...
- vue初级知识总结
从我第一篇博客的搭建环境开始,就开始学习vue了,一直想将这些基本知识点整理出来,但是一直不知如何下手,今天刚好实战了两个小demo,所以就想趁这机会将以前的一起整理出来,这是vue最基础的知识,我有 ...
- vue 初级小总结
(1)插值,即渲染文本 文本:数据绑定最常见的形式就是使用 {{...}}(双大括号)的文本插值 <h1>{{ message }}</h1> data() { return ...
- vue初级学习--使用 vue-resource 请求数据
一.导语 我发现好像我最近几次写文,都是在7号,很恰巧啊~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ...
- Vue初级-样式
整个网页不仅有标签还有css进行渲染,所以,现在讲讲在vue里面加入你想加的css. 在不用vue的时候,有一种内联方式加入css(大概是<div style="..."&g ...
- Vue初级
来学习vue.js的宝宝们应该都了解了什么是vue并且是有兴趣去学的,我也是自己学习vue,欢迎大家一起讨论. 现在,我么先自己尝试用vue来写个hello world吧. 一.创建一个 .html ...
随机推荐
- 第06组 Alpha冲刺（1/4）
队名:福大帮 组长博客链接:https://www.cnblogs.com/mhq-mhq/p/11863075.html 作业博客 :https://edu.cnblogs.com/campus/f ...
- MongoDB笔记: 常见问题
系统配置 设置ulimit MongoDB的文件机制 每个Collection会单独创建一个数据文件(collection-xxxxxx.wt) 每个索引会单独创建一个文件(index-xxxxxx. ...
- [转]JRebel 热部署激活教程
原文地址:https://cloud.tencent.com/developer/news/303750 JRebel的官方地址(https://zeroturnaround.com/software ...
- 如何通过配置tomcat或是web.xml让ie直接下载文件
web.xml(tomcat\conf\web.xml)中配置了 <mime-mapping> <extension>txt</extension> < ...
- Qt QtXml读取xml文件内容
Qt QtXml读取xml文件内容 xml文件内容 <?xml version="1.0" encoding="UTF-8"?> <YG_RT ...
- [LeetCode] 119. Pascal's Triangle II 杨辉三角 II
Given an index k, return the kth row of the Pascal's triangle. For example, given k = 3,Return [1,3, ...
- app内嵌h5页面在ios手机端滑动卡顿的解决方法
1.带滚动条的dom需加样式 -webkit-overflow-scrolling: touch;2.去掉 width:100%; height:100%
- hexo 博客如何更换电脑
如何在更换电脑后继续使用Hexo部署博客 重要目录 _config.yml package.json scaffolds/ source/ themes/ 在新电脑上配置hexo环境:安装node.j ...
- js图表库
highcharts:https://www.hcharts.cn/ 商用收费,个人.公益免费,业界良心 百度家也有个echarts:http://echarts.baidu.com/ 免费,有许多小 ...
- 微服务架构下使用Spring Cloud Zuul作为网关将多个微服务整合到一个Swagger服务上
注意: 如果你正在研究微服务,那必然少不了服务之间的相互调用,哪么服务之间的接口以及api就必须生成系统的管理文档了.如果你希望更好的管理你的API,你希望有一个工具能一站式地解决API相关的所有事情 ...