010 表单各种不同的组件介绍

index.vue

<template>
    <view class="out">
        <!-- <video src="../../static/images/media.mp4" initial-time="20" :controls="false"></video> -->
        <!-- button -->
        <button size="mini" type="primary" @click="onclick">Submit</button>
        <button size="mini" type="warn" @click="onclick">Submit</button>
        <button size="mini" type="warn" plain="true" loading="true" @click="onclick">Submit</button>
        <!-- input -->
        <input type="text" placeholder="Please Input" />

        
    </view>
</template>

<script>
    export default {
        data() {
            return {
                message: null,
            }
        },
        methods: {
            onclick() {
                this.message = 'Hello';
                alert(this.message);
            }
        }
    }
</script>

<style lang="scss" ;>
    .out {
        .box {
            width: 200px;
            height: 200px;
            background: pink;
        }

        .block {
            width: 750rpx;
            height: 200rpx;
            background: green;
        }
    }
</style>