uniapp多个单选按钮radio实现

uniapp多个单选按钮radio实现

村头老杨头

Sun Mar 22

村头老杨头
<template>
  <view class="content">
    <view>
      <text class="colorRed">*</text>是否发烧
      <view class="radio-box">
        <radio-group class="radio-groups" @change="changeSw($event,'ishot')">
          <radio value="true" name="na" id="id">是</radio>
          <radio value="false" name="na" id="id">否</radio>
	</radio-group>
      </view>
    </view>
    <view>
      <text class="colorRed">*</text>是否咳嗽
      <view class="radio-box">
        <radio-group class="radio-groups" @change="changeSw($event,'iskeke')">
          <radio value="true">是</radio>
          <radio value="false">否</radio>
        </radio-group>
      </view>
    </view>
    <view>
      <view>发烧:<text v-text="ishot"></text></view>
      <view>咳嗽:<text v-text="iskeke"></text></view>
    </view>
  </view>
</template>
<script>
  export default {
    data() {
      return {
	ishot:null,
	iskeke:null,
      }
    },
    methods: {
      changeSw(event, val) {
	switch (val) {
	  case 'ishot':
	    this.ishot = event.detail.value;
	    break;
	  case 'iskeke':
	    this.iskeke = event.detail.value;
	    break;
	}
      }
    }
  }
</script>

<style>
  .radio-groups{
    display: flex;
    justify-content: space-around;
  }
</style>

QQ截图20200322040304

评论