组件进阶
mixins：混入
render：实现对虚拟DOM的操作
mixins基础代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div id="app">
<my></my>
<you></you>
</div>
<script src="../vue.js"></script>
<script>
var myMix={
methods:{
show(){
alert()
}
}
}//共同的代码多余的
Vue.component('my',{
mixins:[myMix],
template:`
<div>
<button @click="show">按钮</button>
</div>
`
})
Vue.component('you',{
mixins:[myMix],
template:`
<div>
<button @click="show">按钮</button>
</div>
`
})
let vm=new Vue({
el:"#app"
})
</script>
</body>
</html>
render基础代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div id="app">
<my></my>
</div>
<script src="../vue.js"></script>
<script>
Vue.component('my',{
render(createElement) {
return createElement('p',{
style:{
width:'200px',
height:'200px',
background:'red'
},
attrs:{
id:'box'
}//属性
},[
createElement('span'),
createElement('img')
]//数组，创建标签
)
}
})
let vm=new Vue({
el:"#app"
})
</script>
</body>
</html>
渡一教育第二节笔记
条件语句：
if…else…语句：
if(条件){
条件成立执行语句
}else{
否则执行语句
}
if…else…if…只要一个满足了条件后面就都不要了。（要满足条件互不互斥才能使用if…else…if…）
if(age < 10){
alert("你还不到10岁！");
}else if(age = 10){
alert("你10岁了！")
}else{
alert("要好好学习哦！");
}
switch…case：
是另一种流程控制语句，更适用于多条分支使用同一条语句的情况。
注意case语句只是标识的程序运行的起点，所以一旦符合case的条件程序会一直运行到结束。一般会在case中添加break作为语句的结束。
switch(条件表达式){
case 表达式:
语句
break;
case 表达式:
语句
break;
default:
语句
break;
}
For 循环
for 循环的语法如下：
for (语句 1; 语句 2; 语句 3) {
要执行的代码块
}
for循环一般会经常被用到不难。
while循环：
while中的条件表达式将会被转换为布尔类型
while 循环的执行顺序非常简单，它的格式是：
while (表达式)
{
语句；
}
扫一扫
4714
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
