在当前页面加.native给组件加点击事件

• 效果图

  
  image.png
• 图上是封装的组件，组件中没有点击事件，也没有使用子传父的方式，使用的是.native，给当前组件添加点击事件

<template>
    <!-- 系统设置页面开始布局 -->
    <view class="sheZhi">
        <page-muban title="关于我们" icon="qianbao" @click.native="about(1)"></page-muban>
        <view class="sheZhi-bind">
            <view class="sheZhi-bind-tit">账户绑定</view>
            <page-muban title="手机绑定" icon="qianbao" :content="$fromat.ipone" @click.native="about(2)"></page-muban>
        </view>
        <view class="sheZhi-bind">
            <view class="sheZhi-bind-tit">安全设置</view>
            <page-muban title="登录密码" icon="qianbao" content="点击修改" @click.native="about(3)"></page-muban>
            <page-muban title="支付密码" icon="qianbao" content="设置密码" @click.native="about(4)"></page-muban>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                
            };
        },
        onLoad() {
            
        },
        methods:{
            about(k){
                switch (k){
                    case 1:
                        console.log(11)
                        break;
                    case 2:
                        console.log(22)
                        break;
                    case 3:
                        console.log(33)
                        break;
                    default:
                        console.log(44)
                        break;
                }
            }
        }
    }
</script>

<style lang="scss">
    page{
        height: 100%;
    }
    .sheZhi{
        width: 100%;
        height: 100%;
        background-color:#f4f5f6 ;
        box-sizing: border-box;
        padding-top: 8rpx;
        .sheZhi-bind{
            background: #fff;
            margin-top: 8rpx;
            .sheZhi-bind-tit{
                padding: 20rpx 40rpx;
                border-bottom: 1rpx solid #eee;
            }
        }
    }
</style>