如何在Redux类组件上格式化消息

debugcn 发表于 Dev

TCS

尝试在类组件上使用“ formatMessage”。

但这行不通；

import { injectIntl } from "react-intl";
......
  render() {
    const {formatMessage} = this.props.intl;
      return (
          <div class="card card-custom">
            <div class="card-header flex-wrap border-0 pt-6 pb-0">
              <div class="card-title">
                <h3 class="card-label">{formatMessage({ id: "LOCATION.INDEX.TITLE" })}
                <span class="d-block text-muted pt-2 font-size-sm">light head and row separator</span></h3>
              </div>
            </div>
            <div class="card-body">
              <table ref="main" class="table table-striped- table-hover table-checkable" />
            </div>
          </div>);
  }
}

export default connect(
  ({ auth }) => ({ authToken: auth.authToken }),
  auth.actions
)(DataTable);

它返回

TypeError：无法读取未定义的属性“ formatMessage”

我该如何解决？

strdr4605

从文档。

您应该用 injectIntl

import { injectIntl } from "react-intl";
......
  render() {
    const {formatMessage} = this.props.intl;
      return (
          <div class="card card-custom">
            <div class="card-header flex-wrap border-0 pt-6 pb-0">
              <div class="card-title">
                <h3 class="card-label">{formatMessage({ id: "LOCATION.INDEX.TITLE" })}
                <span class="d-block text-muted pt-2 font-size-sm">light head and row separator</span></h3>
              </div>
            </div>
            <div class="card-body">
              <table ref="main" class="table table-striped- table-hover table-checkable" />
            </div>
          </div>);
  }
}

export default connect(
  ({ auth }) => ({ authToken: auth.authToken }),
  auth.actions
)(injectIntl(DataTable)); // here we use injectIntl HOC

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。