zoukankan      html  css  js  c++  java
  • solt插槽简单使用实例

    在父组件内可以定义方法,变量 等,还可以在父组件中使用呢。

    样式可以在子组件里写,也可以在父组件写。

    子组件:

    <template>
        <div class="admin-user-layout">
            bujubububububuubub
            <slot></slot>
        </div>
    </template>
    
    <script>
        export default {
            name: "AdminUserLayout"
        }
    </script>
    
    <style scoped lang="stylus">
        .testtest
            color: red
    </style>

    父组件中使用:

    <template>
        <div class="admin-user-detail">
            <!--测试-->
            <AdminUserLayout>
                <div @click="handleAmend" class="testtest">点击点击</div>
                <input type="text" v-model="testmodel">
            </AdminUserLayout>
    
        </div>
    </template>
    
    <script>
    
        import BtnGoupBottom from "../components/basic/BtnGroupBottom"
        import AdminUserLayout from "../components/basic/AdminUserLayout"
        export default {
            name: "AdminUserDetail",
            components:{
                AdminUserLayout
            },
            data(){
                return{
                    detailData: {},
                    testmodel: ''
                }
            },
            /*
            watch: {
                testmodel: function (val, oldVal) {
                    console.log(val);
                }
            },
            */
            methods: {
               
                //修改
                handleAmend(){
                    console.log('修改');
                }
            }
            
    
        }
    </script>
    
    <style scoped lang="stylus">
    
    
    
    </style>
  • 相关阅读:
    [.NET学习]抽象&#
    几个国内开源
    通过C#命令行&#
    我的宝贝
    我的新博客
    常用的在线网
    收集一些.NET开
    论研究生学术
    在vs2008里安装使&#
    c#编码好习惯
  • 原文地址:https://www.cnblogs.com/taohuaya/p/10308400.html
Copyright © 2011-2022 走看看