picker多列选择器用法

Picker多列选择器的用法可以分为以下几个步骤：

1. 声明Picker组件

在HTML中使用`<select>`标签来声明Picker组件，每个`<select>`标签代表一个列，同时需要为每个`<select>`标签指定一个唯一的id，以便后面的JavaScript代码可以找到对应的列。

<select id="column1">
  <option value="option1">Option 1</option>
  <option value="option2">Option 2</option>
  <option value="option3">Option 3</option>
</select>
<select id="column2">
  <option value="optionA">Option A</option>
  <option value="optionB">Option B</option>
  <option value="optionC">Option C</option>
</select>

2. 获取选中的选项

在JavaScript中，可以通过`document.getElementById()`方法获取每个列的DOM元素，然后通过`selectedIndex`属性获取当前选中的选项的索引，再通过`options`属性获取所有选项的数组，最后通过选项的索引获取选项的值。

var column1 = document.getElementById("column1");
var column2 = document.getElementById("column2");
var option1 = column1.options[column1.selectedIndex].value;
var option2 = column2.options[column2.selectedIndex].value;

3. 监听选项变化事件

为了响应用户的操作，可以为每个列添加`onchange`事件监听器，当用户选择不同的选项时，就会触发相应的事件处理函数。

column1.onchange = function() {
  var option1 = column1.options[column1.selectedIndex].value;
  var option2 = column2.options[column2.selectedIndex].value;
  console.log(option1, option2);
};
column2.onchange = function() {
  var option1 = column1.options[column1.selectedIndex].value;
  var option2 = column2.options[column2.selectedIndex].value;
  console.log(option1, option2);
};

4. 动态更新选项

如果需要根据用户的选择动态更新其他列的选项，可以在事件处理函数中修改对应列的选项。例如，当用户选择了第一个列的第一个选项时，第二个列的选项就会更新为A、B、C三个选项。

column1.onchange = function() {
  var option1 = column1.options[column1.selectedIndex].value;
  if (option1 === "option1") {
    column2.options.length = 0;
    column2.options.add(new Option("Option A", "optionA"));
    column2.options.add(new Option("Option B", "optionB"));
    column2.options.add(new Option("Option C", "optionC"));
  } else {
    column2.options.length = 0;
    column2.options.add(new Option("Option X", "optionX"));
    column2.options.add(new Option("Option Y", "optionY"));
    column2.options.add(new Option("Option Z", "optionZ"));
  }
};

通过以上步骤，就可以实现一个简单的Picker多列选择器。需要注意的是，以上示例只包含两列选项，实际使用中可能需要根据具体需求添加更多的列。