Vue 组件 props

技术QQ交流群:294088839

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Vue 组件 props</title>
    <script type="text/javascript" src="../assets/js/vue.js"></script>
</head>
<body>
<h1>Vue 组件 props</h1>
<hr>
<div id="app">
    <whl here="河南">

    </whl>
    <whl v-bind:here="message">

    </whl>
</div>

</body>
</html>
<script>

    var app = new Vue({
        el:'#app',
        data:{
            message:'四川'
        },
        //局部组件 如果属性中 有 -  例如 from-here 这样写法 在Vue中需要改成小驼峰的格式 fromHere 就可以认识
        components:{
            'whl':{
                template:`<div style="color:green"> 我是从{{here}}来的</div>`,
                props:['here']
            }
        }
    });

</script>

猜你喜欢

转载自blog.csdn.net/drug_/article/details/81109464