bn-q-icon/pages/index/index.vue

<template>
	<view class="box-data">
    <Nav title="首页"></Nav>
    <view class="border-item"></view>
    <enInput v-model="text" label="姓名"></enInput>
    <enSend v-model="phone" ref="enSendObj" @getCode="getCode"></enSend>
    <enCheckbox v-model="type"  label="爱好" :checkboxData="checkboxData"></enCheckbox>
    <enRadio v-model="sex"  label="性别" :radioData="radioData"></enRadio>
    <enSwitch v-model="status"  label="状态" ></enSwitch>
    <enTextarea v-model="content" label="个人简介"></enTextarea>
    <enDate v-model="birthday" type="datetime" label="生日"></enDate>

  </view>

</template>
<script>

  import enInput from "components/en-input/en-input"
  import enSend from "components/en-send/en-send"
  import enCheckbox from "components/en-checkbox/en-checkbox"
  import enRadio from "components/en-radio/en-radio"
  import enSwitch from "components/en-switch/en-switch"
  import enTextarea from "components/en-textarea/en-textarea"
  import enDate from "components/en-date/en-date"
	export default {
		components: {
      enDate,
      enTextarea,
      enSwitch,
      enRadio,
      enCheckbox,
      enInput,
      enSend
		},
		data() {
			return {
        phone:'13900139001',
        birthday:'',
        text:'来自火星的你',
        content:'你会火星语吗?你会火星语吗?你会火星语吗?你会火星语吗?你会火星语吗?你会火星语吗?你会火星语吗?你会火星语吗?你会火星语吗?你会火星语吗?你会火星语吗?你会火星语吗?你会火星语吗?你会火星语吗?你会火星语吗?你会火星语吗?你会火星语吗?你会火星语吗?你会火星语吗?你会火星语吗?你会火星语吗?你会火星语吗?',
        type:['1'],
        sex:'1',
        status:1,
        // checkboxData:[{'id':'1','name':'足球'},{'id':'2','name':'篮球'},{'id':'3','name':'排球'},{'id':'4','name':'羽毛球'},{'id':'5','name':'乒乓球'},{'id':'6','name':'铅球'},{'id':'7','name':'棒球'},{'id':'8','name':'冰球'},{'id':'9','name':'网球'},{'id':'10','name':'乒乓球'}]
        checkboxData:[{'id':'1','name':'足球'},{'id':'2','name':'篮球'},{'id':'3','name':'排球'}],
        radioData:[{'id':'1','name':'男'},{'id':'2','name':'女'}]
			}
		},
    watch:{
      'birthday':function (){
        console.log('new--------birthday',this.birthday)
      },
      'content':function (){
        console.log('new--------content',this.content)
      },
      'type':function (){
        console.log('new--------type',this.type)
      },
		  'phone':function (){
        console.log('new--------'+this.phone)
      },
      'text':function (){
        console.log('new--------'+this.text)
      },
      'status':function (){
        console.log('new--------'+this.status)
      }

    },

		mounted() {

		},
		methods: {
      getCode(){
        console.log('---------------------asdsa')
        this.text='abc'
        this.$refs.enSendObj.setCodeNum()
      },


		},
	}
</script>
<style lang="scss" scoped>
.border-item{
  border-bottom: 2rpx solid #F0F0F0;
}
.box-data{
  padding: 32rpx 32rpx 0;
  background-color: #fff;
}
</style>