<template>
  <div>
    <!-- 默认2种主题色 -->
    <bxs-protocol
      :protocol-list="protocolList"
      v-model="checked"
      />
    <bxs-protocol
      :protocol-list="protocolList"
      v-model="checked2"
      type="minor"
      />
    <!-- 颜色定制 -->
    <bxs-protocol
      :protocol-list="protocolList"
      v-model="checked3"
      :highlight-color="color"
      />
    <!-- 有辅助文案 -->
    <bxs-protocol
      :protocol-list="protocolList"
      v-model="checked4"
      >
      <div slot="subText">
        辅助文案，如果有的话，展示完整，支持换行。辅助文案，如果有的话，展示完整，支持换行辅助文案，如果有的话，展示完整，支持换行辅助文案
      </div>
    </bxs-protocol>
  </div>
</template>
<script>
export default {
  data() {
    return {
      protocolList: [
        {
          name: '《投保须知》',
          onClick: this.a,
        },
        {
          name: '《投保须知2》',
          url: 'http://www.baidu.com',
          target: '_blank',
          onClick: this.a,
        },
      ],
      checked: false,
      checked2: true,
      checked3: false,
      checked4: false,
      color: '#4b0',
    }
  },
  methods: {
    a() {
      console.log('点击投保须知')
    },
  },
  watch: {},
}
</script>
<style>
</style>
