vuejs在安卓系统下微信X5内核这个兼容性问题如何破？

Question

小弟第一次使用vue.js做项目开发就遇到了一个坑，本想把区域选择独立为一个子组件来使用，但是组件模式开发的select区域下拉列表在安卓系统的腾讯系的X5内核竟然报错了，导致弹出的select选择框无法选择。

目前测试此问题存在于安卓系统下的腾讯系浏览器，UC系浏览器或webview，安卓下其他浏览器无问题。

有问题

高清图地址：http://qingjin.me/wp-content/...

无问题

主要代码：

<template>
    <div class="region-picker">
      <label class="region">
        <span v-if="currSheng === undefined">省</span>
        <span v-else>{{ currSheng }}</span>
        <select name="sheng" v-model="currSheng">
          <option v-for="sheng in selectArray.sheng">{{ sheng }}</option>
        </select>
      </label>
      <label class="region">
        <span v-if="currShi === undefined">市</span>
        <span v-else>{{ currShi }}</span>
        <select name="shi" v-model="currShi">
          <option v-for="shi in selectArray.shi">{{ shi }}</option>
        </select>
      </label>
      <label class="region" v-if="isQU && currShi !== undefined">
        <span v-if="currQu === undefined">区</span>
        <span v-else>{{ currQu }}</span>
        <select name="qu" v-model="currQu">
          <option v-for="qu in selectArray.qu">{{ qu }}</option>
        </select>
      </label>
    </div>
</template>
<script>
import RegionData from './js/region-data.js'
export default{
  name: 'region-picker',
  data () {
    return {
      regionType: 1,
      isQU: true,
      shengObj: {},
      shiObj: {},
      quObj: {},
      selectArray: {
        sheng: [],
        shi: [],
        qu: []
      },
      currSheng: undefined,
      currShi: undefined,
      currQu: undefined
    }
  },
  created: function () {
    this.getSelectArray(0)
  },
  watch: {
    currSheng: function (val, oldVal) {
      this.selectArray.shi = []
      this.selectArray.qu = []
      let level = 1
      this.shengObj = RegionData.find(
          function (x) {
            return x.name === val
          }
        )
      this.regionType = this.shengObj.type
      this.getSelectArray(level) // 渲染城市列表
      this.currShi = undefined
    },
    currShi: function (val, oldVal) {
      if (this.currShi !== undefined) {
        this.shiObj = undefined
        let level = 2
        if (this.regionType === 0) { // 如果城市只有两级，停止渲染区列表，返回数据
          this.isQU = false
          this.currQu = undefined
          this.returnRegion(level)
        } else {
          this.isQU = true
          this.shiObj = this.shengObj.sub.find(
            function (x) {
              return x.name === val
            }
          )
          this.selectArray.qu = []
          this.getSelectArray(level) // 渲染区域列表
          this.currQu = undefined
        }
      }
    },
    currQu: function (val, oldVal) {
      if (this.currQu !== undefined) {
        this.returnRegion()
      }
    }
  },
  methods: {
    getSelectArray: function (level) {
      if (level === 0) { // 渲染省份列表
        for (var i = 0; i < RegionData.length; i++) {
          this.selectArray.sheng.push(RegionData[i].name)
        }
      } else if (level === 1) { // 渲染城市列表
        for (i = 0; i < this.shengObj.sub.length; i++) {
          this.selectArray.shi.push(this.shengObj.sub[i].name)
        }
      } else if (level === 2 && this.regionType === 1) {
        for (i = 0; i < this.shiObj.sub.length; i++) {
          this.selectArray.qu.push(this.shiObj.sub[i].name)
        }
      }
    },
    returnRegion (level) {
      let regionData
      if (level === 2) {
        regionData = this.currSheng + this.currShi
      } else {
        regionData = this.currSheng + this.currShi + this.currQu
      }
      this.$emit('getRegion', regionData)
    }
  }
}
</script>

Answer 1

是不是浏览器不支持 find 方法？