mt-field 和 picker切换过程中的问题

[varrant]

mt-field 中引用picker过程时候，其中一个是自己输入的，后面一个是picker，这时候，picker会在原生键盘之上弹出。
<mt-field label="昵称" v-model="nickname" placeholder="请输入昵称"></mt-field> <mt-field readonly label="性别" v-model="sex" placeholder="请输入性别" @click.native="chooseGender()" is-link> </mt-field> <mt-popup v-model="genderPopup" position="bottom" class="mint-popup-4"> <mt-picker :slots="sexSlot" @change="onGenderChange"></mt-picker> </mt-popup>

[varrant]

help!

[galenyuan]

没看懂你想描述什么，能写个重现的demo么

[varrant]

<template>
<div>
  <mt-field ref="nick" label="昵称" v-model="nickname" placeholder="请输入昵称"></mt-field>
  <mt-field label="生日" v-model="birthday" placeholder="请输入生日" type="date"></mt-field>
  <mt-field readonly label="性别" v-model="sex" placeholder="请输入性别" @click.native="chooseGender()">
  </mt-field>
  <mt-popup v-model="genderPopup" position="bottom" class="mint-popup-4">
    <mt-picker :slots="sexSlot" @change="onGenderChange"></mt-picker>
  </mt-popup>
</div>
</template>

<script type="application/ecmascript">
export default {
  name: 'register3',
  data() {
    return {
      nickname: '',
      sex: '',
      genderPopup: false,
      sexSlot: [{
        flex: 1,
        values: ['男', '女'],
        className: 'slot1'
      }]
    };
  },
  methods: {
    chooseGender() {
      this.genderPopup = true;
    },
    onGenderChange(picker, values) {
      this.sex = values[0];
    }
  }
};
</script>
<style scoped lang='scss' rel="stylesheet/scss" type="text/css">
.mint-popup-4 {
    width: 100%;
    .picker-item,
    .picker-slot-wrapper {
        backface-visibility: hidden;
    }
}
</style>

[varrant]

我写了一个列子。你可以运行下哈。

[galenyuan]

无法重现，设备信息？

[varrant]

Iphone 6 ..微信端，最新版本微信。

[varrant]

https://github.com/varrant/picker-problem src/veiws/register.vue 文件

[varrant]

beforeCreate() {
document.querySelector('body').addEventListener('touchend', function(e) {
if (e.target.className === 'mint-field-core') {
document.querySelector('.mint-field-core').blur();
}
});
},
用这种方法解决，不知道好坏？

[galenyuan]

找了台iPhone 依然无法重现，你看一下field里面的input有readonly么？

[varrant]

真的。我都不知道怎么表述自己了。
要不你直接clone 这个项目 https://github.com/varrant/picker-problem ，然后运行一下？

[galenyuan]

项目跑不起来，你自己先试试把node_modules删了然后npm run dev。

[varrant]

真的好尴尬。建议出个mt-field 利用picker选择性别的例子@galenyuan

[varrant]

我上面贴的代码，已经加了readonly了