美文网首页
uniApp自定义组件

uniApp自定义组件

作者: 简约酒馆 | 来源:发表于2020-02-04 12:32 被阅读0次

自定义组件代码

<template name="myInput">
    <view>
        <input type="text" value="" :placeholder="placeholder" class="myInput" />
        <button type="primary" @click="submit">提交</button>
    </view>
</template>

<script>
    export default {
        name:"myInput",
        //属性
        // props:{
        //  属性名称:{
        //      type:String,    //属性类型
        //      value:"值"
        //  }
        // },
        // props:["msg"],
        props:{
            msg:{
                type:String,
                default:"真好"   //不传值时使用属性默认值
            },
            placeholder:{
                type:String,
                value:"请输入您的..."
            }
        },
        
        //组件生命周期
        created() {
            
        },
        data() {
            return {
                
            }
        },
        methods: {
            submit(){
                this.$emit("mytest",'来自子组件的问候')
            }
        }
    }
</script>

<style>
    .myInput{
        padding: 20upx;
        background: #eee;
    }
</style>

语法,传参,事件跟VUE一致 ,请参数vue的写法

相关文章

网友评论

      本文标题:uniApp自定义组件

      本文链接:https://www.haomeiwen.com/subject/dgrrxhtx.html