Picker 组件不能传入 dataset 参数

[wind13]

在使用 Picker 组件 mode=time 时，尝试添加 className 是可以的，但想加入一些 data-aaa 之类的属性就不行了，最后出来的 Dom 中是没有的，会有这样的需求，除了取得选择的 value 外，希望再带一些 dataset 的参数，如某行某列的某个 Time Picker 组件，希望知道是哪一行哪一列的等。

[taro-bot]

欢迎提交 Issue~

如果你提交的是 bug 报告，请务必遵循 Issue 模板的规范，尽量用简洁的语言描述你的问题，最好能提供一个稳定简单的复现。🙏🙏🙏

如果你的信息提供过于模糊或不足，或者已经其他 issue 已经存在相关内容，你的 issue 有可能会被关闭。

Good luck and happy coding~

[luckyadam]

这种情况可以，可以用事件 + bind 来进行传参

[taro-bot]

Hello~

您的问题楼上已经有了确切的回答，如果没有更多的问题这个 issue 将在 15 天后被自动关闭。

如果您在这 15 天中更新更多信息自动关闭的流程会自动取消，如有其他问题也可以发起新的 Issue。

Good luck and happy coding~

[wind13]

问题是在微信小程序那边可以正常使用，我是从微信小程序转换过来的，因为这个问题，转过来的小程序不能正常工作，查了半天，发现是因为小程序里设置的 "data-xxx" 并没有传入到 Picker 组件中，同时逻辑上也说不通，"className" 这个属性都是可以的，为什么 "data-xxx" 却不行呢？

[luckyadam]

@wind13 能不能贴一个你的示例代码，我们看下

[wind13]

A picker in wxml file of WeChat.

<picker mode="time" value="{{item.time}}" start="18:30" end="20:59" bindchange="changeTime" 
  data-year="{{m.y}}" data-day="{{item.day}}" data-month="{{m.m}}">
  <view class="picker">
    {{item.time}}
  </view>
</picker>

In the js file of WeChat.

changeDaka: function (e) {
  const ds = e.target.dataset;
  const v = e.detail.value;
  console.log(ds.year);
  console.log(ds.month);
  console.log(ds.day);
  console.log(v);
}

I know we can use bind to pass other params in Taro.js:

<Picker mode="time" value="{{item.time}}" start="18:30" end="20:59" 
  onChange={this.changeTime.bind(this, m.y, m.m, item.day, "pm")}>
  <view className="picker">
    {{item.time}}
  </view>
</Picker>

  changeTime = function (y, m, d, ap, e) {
    const v = e.detail.value;
    console.log(y);
    console.log(m);
    console.log(d);
    console.log(ap);
    console.log(v);
  }

It works.

But I think it would be better if Taro Picker can handle data-xxx.

[luckyadam]

In Taro

<Picker mode="time" value={item.time}" start="18:30" end="20:59"
  data-year={m.y} data-day={item.day} data-month={m.m}
  onChange={this.changeTime.bind(this))}>
  <view className="picker">
    {item.time}
  </view>
</Picker>

event handler like this

changeTime: function (e) {
  const ds = e.target.dataset;
  const v = e.detail.value;
  console.log(ds.year);
  console.log(ds.month);
  console.log(ds.day);
  console.log(v);
}

it works well

[wind13]

No, it doesn't work with me. I am testing under: npm run dev:h5.

[taro-bot]

CC @jinjinjin0731

[kisnows]

同样的问题，传入的 dataset 并没有带入到点击事件的 event 对象里面

[zacksleo]

这个问题啥时候能解决啊

[nanxiaobei]

遇到了这个问题。

使用 weui 的组件，需要在 View 加上 data-weui-theme，结果加不上。