• vue组件-其他


    1

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <script src="bower_components/vue/dist/vue.js"></script>
        <style>
        </style>
    </head>
    <body>
        <div id="box">
            <aaa></aaa>
        </div>
    
        <script>
            var Aaa=Vue.extend({
                data:{
                    msg:'我是笔筒^_^'
                },
                template:'<h3>{{msg}}</h3>'
            });
    
            Vue.component('aaa',Aaa);
    
    
            var vm=new Vue({
                el:'#box',
                data:{
                    bSign:true
                }
            });
    
        </script>
    </body>
    </html>

    2

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <script src="bower_components/vue/dist/vue.js"></script>
        <style>
        </style>
    </head>
    <body>
        <div id="box">
            <aaa></aaa>
        </div>
    
        <script>
            var Aaa=Vue.extend({
                data(){
                    return {
                        msg:'我是标题^^'
                    };
                },
                template:'<h3>{{msg}}</h3>'
            });
    
            Vue.component('aaa',Aaa);
    
    
            var vm=new Vue({
                el:'#box',
                data:{
                    bSign:true
                }
            });
    
        </script>
    </body>
    </html>

    3

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <script src="bower_components/vue/dist/vue.js"></script>
        <style>
        </style>
    </head>
    <body>
        <div id="box">
            <aaa></aaa>
        </div>
    
        <script>
            var Aaa=Vue.extend({
                data(){
                    return {
                        msg:'我是标题^^'
                    };
                },
                methods:{
                    change(){
                        this.msg='changed'
                    }
                },
                template:'<h3 @click="change">{{msg}}</h3>'
            });
    
            Vue.component('aaa',Aaa);
    
    
            var vm=new Vue({
                el:'#box',
                data:{
                    bSign:true
                }
            });
    
        </script>
    </body>
    </html>
  • 相关阅读:
    《JavaScript高级程序设计》读书笔记 14章
    C# 程序集是啥
    C#之反射又是什么东西
    C#版 大数计算器加法
    C#版 大数计算器乘法
    我所认识的三层
    《JavaScript高级程序设计》读书笔记 56章
    C# 委托加深理解
    C#版 大数计算器减法
    C# 事件到底是什么
  • 原文地址:https://www.cnblogs.com/lanlanJser/p/7420953.html
Copyright © 2020-2023  润新知