uniAPP开发 使用Vant下拉菜单，动态更新数据

uniapp转微信小程序开发，使用vant下拉菜单和picker组件，实现动态设置选项

实现以上效果

<van-dropdown-item title="部门" @open="getDepartmentName">
			<van-picker
				show-toolbar
				:columns="columns"
				@confirm="onConfirm"
				@change="onChange"
			/>  
		  </van-dropdown-item>

data() {
			return {
		
				value1: 0,
				value2: 'a',
				columns: [
				      {
				        values: ['国家级','省级','市级','区/镇级'],
				        className: 'column1',
				      },
				      {
				        values: ['1','2'],
				        className: 'column2',
				        defaultIndex: 2,
				      },
				],
			}
		},

1.  先在mounted中请求默认选中的数据:

   computed:{
   	...mapGetters('home',['departNameList'])
   },
   mounted() {
   	let data = {
   		"policyRank":`${this.columns[0].values[0]}`
   	 }
   	this.$store.dispatch('home/getDepartmentList',data)
   },
   methods: {
   	getDepartmentName(){
   	  console.log('准备发请求')
   	  this.columns[1].values=this.departNameList
   	},
   }

2. 触发picker的change事件，再发送请求，获取右侧的数据

   onChange(event) {
   			    const { picker, value, index } = event.detail;
   				console.log(value[0])
   				let data = {
   					"policyRank":`${value[0]}`
   				}
   				this.$store.dispatch('home/getDepartmentList',data)
   			    picker.setColumnValues(1, this.departNameList);
   			  },

3. 监听获取的数据，在computed更改是，将数据赋值给column

   watch:{
   			departNameList:{
   				handler(newQuestion, oldQuestion){
   					this.columns[1].values = newQuestion
   				}
   			}
   		},