遞迴元件

<!-- 生产环境版本，优化了尺寸和速度 -->

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

<script src="https://cdn.jsdelivr.net/npm/axios@0.12.0/dist/axios.min.js"></script>

<script src="https://cdn.jsdelivr.net/npm/vue"></script>

<style>

.fd:after{

content:'123'

}

.haha:before{

content:'55'

}

</style>

<div id="app">

<custom-input :count="1"></custom-input>

</div>

<script>

Vue.component('custom-input', {

name:'custom-input',

props:{

count:{

type:Number,

default:1

}

},

template:'<div class="fd">{{count}}\

<custom-input class="haha"\

:count="count + 1"\

v-if="count <3">\

</custom-input>\

</div>'

})

new Vue({

el:"#app"

})

</script>

結果

1

552

553 66

66

66