uni-app组件创建

1、组件文件

<template name="mybutton">
    <view>
        <button :class="inputFlag? 'button-able':'button-disable'" :hover-class="inputFlag? 'botton-hover':'none'" @click="commit()">{{buttonName}}</button>
    </view>
</template>

<script>
	export default {
		name:"mybutton",
		props: {
			inputFlag: {
				type: Boolean,
			},
			buttonName: {
				type: String,
				value: ""
			},
		},
		data() {
			return {
				
			};
		},
		methods:{
			commit(){
				this.$emit('commit',false) //(父组件中触发的事件名，要传的变量)
			}
		}
	}
</script>
<style lang="scss">
</style>

2、全局引入

在main.js文件中

import mybutton from "../../components/nybutton.vue";

3、使用

<template>
    <view>
        <mybutton buttonName="提交" :inputFlag="inputFlag" @commit='commit()'></mybutton>
    </view>
</template>
<script>
	export default {
		data() {
                inputFlag:''
                },
        methods:{
			    commit(){
				console.log(1)
			},
}
</script>