手动引入 weex-picker 后，native 平台报错

[postbird]

复现

需要三端同时支持 picker，因此手动在组件内部引入了 weex-picker。

引入方式 :

import '../../node_modules/@weex-project/weex-picker/js/build/index.js';
const picker = weex.requireModule('picker');
export default {
})

问题

web 平台使用没有问题，在 native 上抛出错误如下：

18: 2018-07-31 16:22:44.209 WeexDemo <Weex>[exception]bundleJSType:Vue

instanceId:90 bundleUrl:http://x.x.x.x:8081/dist/index.js?random=-2083048737 errorCode:-9400 functionName: exception:[WX_KEY_EXCEPTION_WXBRIDGE] [undefined:3556:24] TypeError: Attempted to assign to readonly property.
exports
t
t
t
t
t
__webpack_require__
__webpack_require__
__webpack_require__
__webpack_require__
__webpack_require__
anonymous
native-bundle-main.js:1:40926
createInstance@native-bundle-main.js:1:40937
native-bundle-main.js:1:255299 userInfo:{
    jsMainBundleStringContentLength = 439986;
    jsMainBundleStringContentMd5 = 410d77edc3e9df9242e748676ffe9dc5;
} jsfmVersion:0.24.4 sdkVersion:0.18.0 appVersion:2.2 osVersion:12.0 platform:iOS deviceModel:iPhone8,2
If you want to know more, please open weex MNT

去掉 import 后，无报错

期望

weex-picker 的引入是否只能使用 script？如果想在组件内部引入，如何操作？

[muzin]

解决办法

如果需要同时三端支持 picker，需要在引入'weex-vue-render'后再引入weex-picker。 如下：

import Vue from 'vue'
import weex from 'weex-vue-render'
import WeexPicker from '@weex-project/weex-picker'
/* global Vue */

weex.init(Vue)
/* weex initialized here, please do not move this line */

方案

修改@项目/configs/webpack.common.conf.js文件。 在webpack.common.conf.js中，getEntryFileContent函数向entry文件前面加入了引入vue，weex-vue-render的操作，在引入weex-vue-render后面加上引入weex-picker。 如下：

const getEntryFileContent = (source, routerpath) => {
  let dependence = `import Vue from 'vue'\n`;
  dependence += `import weex from 'weex-vue-render'\n`;

  // ==============================
  // Look here，看这～
  dependence += `import WeexPicker from '@weex-project/weex-picker'\n`;

  // ==============================

  let relativePluginPath = helper.rootNode(config.pluginFilePath);
  let entryContents = fs.readFileSync(source).toString();
  let contents = '';
  entryContents = dependence + entryContents;
  entryContents = entryContents.replace(/\/\* weex initialized/, match => `weex.init(Vue)\n${match}`);
  if (isWin) {
    relativePluginPath = relativePluginPath.replace(/\\/g, '\\\\');
  }
  if (hasPluginInstalled) {
    contents += `\n// If detact plugins/plugin.js is exist, import and the plugin.js\n`;
    contents += `import plugins from '${relativePluginPath}';\n`;
    contents += `plugins.forEach(function (plugin) {\n\tweex.install(plugin)\n});\n\n`;
    entryContents = entryContents.replace(/weex\.init/, match => `${contents}${match}`);
  }
  return entryContents;
}

希望上面的方案可以解决三端兼容问题，如果还不能解决可以联系我。 Email: sirius1@aliyun.com

Good Luck～

[postbird]

@muzin 方案二解决问题，方案一报的错和我之前尝试的方式报错是一样的。

[yjzfun]

Picker max min参数无效。

        picker.pickDate({
          value: this.value,
          min: '2019-01-22',
          max: '2019-01-23'
        }, event => {
          if (event.result === 'success') {
            this.dateValue = event.data
          }
        })

仍然可以选择超过1月23号的日期。

[yjzfun]

Picker max min参数无效。

        picker.pickDate({
          value: this.value,
          min: '2019-01-22',
          max: '2019-01-23'
        }, event => {
          if (event.result === 'success') {
            this.dateValue = event.data
          }
        })

仍然可以选择超过1月23号的日期。

已解决。 改成max: '2019/01/23' 即可