递归组件
2018-07-07 本文已影响0人
嗯哼_3395
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<script src="vue.js"></script>
</head>
<body>
<div id="box">
<veb :num="num"></veb>
</div>
</body>
<script>
//递归函数：自己调用自己，要有结束条件，组件的递归就好组件包含组件
Vue.component("veb",{
props:["num"],
//首先要有一个name的属性，相当于veb的别名
name:"ha",
//<ha :num='num+1'></ha>相当于<veb :num="num"></veb>
template:"<div>{{num}}<ha :num='num+1' v-if='num<10'></ha></div>"
})
var box=new Vue({
el:"#box",
data:{
num:1
}
})
//递归函数的例子,兔子问题，斐波那契数列
function fun(n){
if(n==1||n==2){
return 1
}else{
return fun(n-1)+fun(n-2)
}
}
console.log(fun(8))
</script>
</html>
