基础功能

帮助提示,用于标注某个注解说明。


当ibps-highlight元素中注入对应数据后得效果,可以丰富展示效果。

<template>
  <ibps-container type="full" class="page">
    <el-row :gutter="12">

      <el-col :span="17">
        <el-card>
          <div slot="header" class="clearfix">
            基础示例
          </div>
          <el-row>
            <ibps-org-selector
              v-model="selectedValue1"
              multiple
            />
            // 此处调用
            <ibps-highlight>
              &lt;ibps-org-selector v-model="selectedValue" /&gt;
            </ibps-highlight>

          </el-row>
        </el-card>
      </el-col>
      <el-col :span="7">
        <el-card>
          <div slot="header" class="clearfix">
            <el-icon type="stats-bars" />
            数据展示
          </div>
          <el-row>
            <pre style="font-size:12px;">
{{ showRes }}
            </pre>
          </el-row>
        </el-card>
      </el-col>
    </el-row>
  </ibps-container>
</template>

<script>
import IbpsOrgSelector from '@/business/platform/org/org/selector'

export default {
  components: {
    IbpsOrgSelector
  },
  data() {
    return {
      selectorVisible: false,
      showRes: null,

      selectedValue1: '500364375878533120',

      placeholder1: '请选择组织',
      separate1: '>',
      displayType1: 'path',
      multiple1: false,

      selectedValue2: '',
      selectedValue3: '',

      selectedValue21: '',
      selectedValue31: '',

      selectedValue4: 'xj2',
      selectedValue5: 'xj2',

      selectedValue6: 'xj2',
      selectedValue7: 'xj2'
    }
  },
  watch: {
    selectedValue1(val) {
      this.showRes = val
    },
    selectedValue2(val) {
      this.showRes = val
    },
    selectedValue3(val) {
      this.showRes = val
    },
    selectedValue4(val) {
      this.showRes = val
    },
    selectedValue5(val) {
      this.showRes = val
    },
    selectedValue6(val) {
      this.showRes = val
    }
  },
  methods: {
    change1(val) {
      console.log(val)
    }
  }
}
</script>
文档更新时间: 2021-05-24 14:58   作者:admin