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>
相关推荐
小陈工6 分钟前
Python Web开发入门(十六):前后端分离架构设计——从“各自为政”到“高效协同”
开发语言·前端·数据库·人工智能·python
欣然~11 分钟前
FachuanHybridSystem 项目 Windows 完整安装启动文档
前端
anyup12 分钟前
uView Pro 的主题系统有多强大?3 分钟设计 uni-app 企业级 UI 主题
前端·vue.js·uni-app
BUG_Jia15 分钟前
Vue 3 组件封装与使用:保姆级教程
前端·javascript·vue.js
奇舞精选18 分钟前
观察 AIRI 源码:一个 Agent 系统如何处理入口、扩展与执行闭环
前端·openai
江湖行骗老中医31 分钟前
Pinia 是 Vue 的专属状态管理库
前端·javascript·vue.js
用户693717500138432 分钟前
Android 开发,别只钻技术一亩三分地,也该学点“广度”了
android·前端·后端
郑鱼咚33 分钟前
别再神化Spec了,它可能只是AI Coding的临时补丁
前端
张元清37 分钟前
React 鼠标追踪与交互效果实战
前端·javascript·面试
MinterFusion37 分钟前
HTML DOM元素的定位问题
前端·css·html