小编Ash*_*ijk的帖子

我正在将redux-form迁移到最新版本6.0.0rc3.在这个版本中,'fields'数组已经消失,并被Field组件取代(参见http://redux-form.com/6.0.0-rc.3/docs/MigrationGuide.md/).我曾经在v5中扩展默认的onBlur函数,如下所示:

const { user_zipcode } = this.props.fields;
onChange={
  val => user_zipcode.onChange(this._handleZipcodeChange(val))
}

但是,在新版本中,这不能再做了,因为this.props.fields不存在.

从我在文档中找到的内容来看,新的方法应该是为每个具有不同功能的表单字段创建一个组件,并在那里扩展onBlur函数:

_onBlur() {
  // my custom blur-function
}

render() {
  const { input, touched, error } = this.props;
  return (
    <input
      className={styles.input}
      {...input}
      onBlur={() => {
        // 2 functions need to be called here
        this._onBlur();
        input.onBlur();
      }}
    />
  );
}

这很好,除了我需要为每个字段创建一个新元素,当模糊事件发生时需要做一些不同的事情.在某些领域,我必须调用API,我通过调度操作来完成.例如,我必须这样做才能得到一个地址.在这些组件中,我必须连接我的商店,因此它连接多次.

我试图将我的自定义函数从父组件传递给Field组件,如下所示:

<Field
  type="text"
  name="user_zipcode"
  component={Zipcode}
  onBlurFunction={this._myBlurFunction}
/>

从props中获取我的组件中的两个函数:

...
onBlur={() => {
  input.onBlurFunction();
  input.onBlur();
}}
...

由于新的React警告,这无法正常工作.

有一个更好的方法吗？

我正在使用 mini-css-extract-plugin 提取我的应用程序的 css。它确实有效，因为它正确地提取和拆分了我导入的组件的 css。它还提取到“main.css”，其中是来自非动态导入的模块的样式。

但是，最后一个文件 main.css 未加载到我的应用程序中。我需要手动加载这个文件<link>吗？

网络包：4.12.0

mini-css-extract-plugin: 0.4.0

我的配置：

plugins: [
    new webpack.optimize.ModuleConcatenationPlugin(),
    new MiniCssExtractPlugin({
        filename: 'main.css',
        chunkFilename: '[name].[contenthash].css',
    }),
],

module: {
    rules: [
    {
        test: /\.(css|less)$/,
        exclude: /node_modules/,
        use: [
            MiniCssExtractPlugin.loader,
            {
                loader: 'css-loader',
                options: {
                    modules: true,
                    localIdentName: '[name]__[local]',
                },
            },
            {
                loader: 'less-loader',
                options: {
                    javascriptEnabled: true,
                },
            },
        ],
    }
]