作者:管理员  历史版本:1  最后编辑:龚清  更新时间:2024-05-28 11:17

基础的配置

页面代码

ibps-address基本的配置,单个与级联地址控件数据的代码展示。

<template>
 ...
   <ibps-address
     ref="address"
     v-model="fieldOptions.default_value"
     :top-val="topval||'0'"
     :top="fieldOptions.top || 'country'"
     :level="fieldOptions.level||'district'"
     data-type="code"
     clearable
     />
...
   <ibps-address-cascader
    ref="address"
    v-model="formData.area"
    :placeholder="$t('common.placeholder.please-select-content',{title:$utils.lowerFirst( $t('system.login.companyArea'))})"
    :data="areaData"
    level="province"
    top-val="86"
    data-type="name"
    />
...
</template>

<script>
import IbpsAddress from '@/components/ibps-address/cascader'
import IbpsAddressCascader from '@/components/ibps-address/cascader'

export default {
  components: {
    ...
    IbpsAddress,
    IbpsAddressCascader
    ...
  },
  data() {
    ...
  }
}
</script>

获取内部值和方法

可以通过 ref 拿到地址组件实时数据以及内部方法。

...
this.$refs.address.initData()//初始化地址控件值
...

以上为暂时个例的取值和方法通过ref进行调用,详细的请查看API进行使用。