van-picker级联设置默认选择

在Vanilla Picker(van-picker)组件中,您可以使用setIndexes方法来设置选择的索引。这个方法可以帮助您在需要时通过编程方式设置选择的值。

复制代码
<template>
  <van-picker
    :columns="columns"
    ref="pickerRef"
  />
  <button @click="setSelectedIndexes">Set Selected Indexes</button>
</template>

<script>
import { ref } from 'vue';

export default {
  setup() {
    const pickerRef = ref(null);
    const columns = [
      {
        values: ['Option 1', 'Option 2', 'Option 3']
      },
      {
        values: ['Suboption 1', 'Suboption 2', 'Suboption 3']
      }
    ];

    const setSelectedIndexes = () => {
      const indexes = [1, 2]; // Set the desired indexes
      pickerRef.value.setIndexes(indexes);
    };

    return {
      columns,
      pickerRef,
      setSelectedIndexes
    };
  }
};
</script>
相关推荐
m0_7190841120 分钟前
React笔记张天禹
前端·笔记·react.js
Ziky学习记录34 分钟前
从零到实战:React Router 学习与总结
前端·学习·react.js
wuhen_n39 分钟前
JavaScript链表与双向链表实现:理解数组与链表的差异
前端·javascript
wuhen_n43 分钟前
JavaScript数据结构深度解析:栈、队列与树的实现与应用
前端·javascript
狗哥哥1 小时前
微前端路由设计方案 & 子应用管理保活
前端·架构
前端大卫2 小时前
Vue3 + Element-Plus 自定义虚拟表格滚动实现方案【附源码】
前端
却尘2 小时前
Next.js 请求最佳实践 - vercel 2026一月发布指南
前端·react.js·next.js
ccnocare2 小时前
浅浅看一下设计模式
前端
Lee川2 小时前
🎬 从标签到屏幕:揭秘现代网页构建与适配之道
前端·面试
Ticnix2 小时前
ECharts初始化、销毁、resize 适配组件封装(含完整封装代码)
前端·echarts