尝试在我的项目上使用Carbon进行本地化。碳很好，我测试过了。我已经尝试将下面的代码块添加到我的模型文件:
use DateTimeInterface;
protected function serializeDate(DateTimeInterface $date)
{
return $date->translatedFormat('A B M');
}
所以我的模型文件看起来像这样(文件->home/username/public_html/app/Models/TransferRecords.php:
<?php
namespace AppModels;
use AppEventsTransferRecordSaved;
use AppHelpersCoinFormatter;
use IlluminateDatabaseEloquentModel;
use DateTimeInterface;
class TransferRecord extends Model
{
/**
* The attributes that aren't mass assignable.
*
* @var array
*/
protected $guarded = [];
/**
* The event map for the model.
*
* @var array
*/
protected $dispatchesEvents = [
'saved' => TransferRecordSaved::class,
];
protected $appends = [
'value_price',
'hash',
'formatted_value_price',
'coin',
'confirmed',
];
/**
* The relationships that should always be loaded.
*
* @var array
*/
protected $with = [
'walletAccount',
];
/**
* @return bool
*/
public function getConfirmedAttribute()
{
return $this->confirmations >= $this->required_confirmations;
}
/**
* @return mixed|string
*/
public function getCoinAttribute()
{
return $this->walletAccount->wallet->coin->name;
}
/**
* @param $value
*/
public function setValueAttribute($value)
{
if ($value instanceof CoinFormatter) {
$this->attributes['value'] = $value->getAmount();
} else {
$this->attributes['value'] = (float) $value;
}
}
/**
* @return CoinFormatter|mixed
*/
public function getValueObject()
{
return coin($this->getOriginal('value'), $this->walletAccount->wallet->coin);
}
/**
* Get value converted from base unit
*
* @param $value
* @return float
*/
public function getValueAttribute()
{
return $this->getValueObject()->getValue();
}
/**
* Get the price of the value
*
* @return HolluwaTosin360CurrencyCurrency|string
*/
public function getValuePriceAttribute()
{
return $this->getValueObject()
->getPrice($this->walletAccount->user->currency, $this->dollar_price);
}
/**
* Get formatted price of the value
*
* @return HolluwaTosin360CurrencyCurrency|string
*/
public function getFormattedValuePriceAttribute()
{
return $this->getValueObject()
->getFormattedPrice($this->walletAccount->user->currency, $this->dollar_price);
}
/**
* @return IlluminateDatabaseEloquentRelationsBelongsTo|WalletAddress
*/
public function receiverWalletAddress()
{
return $this->belongsTo('AppModelsWalletAddress', 'receiver_wallet_address_id', 'id');
}
/**
* @return IlluminateDatabaseEloquentRelationsBelongsTo|WalletTransaction
*/
public function walletTransaction()
{
return $this->belongsTo('AppModelsWalletTransaction', 'wallet_transaction_id', 'id');
}
/**
* Get transaction hash
*
* @return mixed
*/
public function getHashAttribute()
{
return $this->walletTransaction()->value('hash');
}
/**
* @return IlluminateDatabaseEloquentRelationsBelongsTo|WalletAccount
*/
public function walletAccount()
{
return $this->belongsTo('AppModelsWalletAccount', 'wallet_account_id', 'id');
}
protected function serializeDate(DateTimeInterface $date)
{
return $date->translatedFormat('A B M');
}
}
然后在resources/routes/wallets/components/RecorsTable/index.js文件中，我试图使用translatedFormat()函数以获得翻译格式的日期。取值为{formatUTC(text)}:
dataIndex : 'created_at',
sorter : (a, b) => sortDate(a.created_at, b.created_at),
render : text => (
<div style={{whiteSpace : 'nowrap'}}>
{formatUTC(text)}
</div>
resources/routes/wallets/components/RecorsTable/index.js文件的完整版本:
import React, {Component} from 'react';
import {Tag} from "antd";
import Widget from "components/Widget";
import {FormattedMessage, injectIntl} from "react-intl";
import AsyncTable from "components/AsyncTable";
import {route} from "support/Services/Api";
import Auth from "support/Auth";
import {formatUTCDate, pipe, sortDate} from "support/utils/common";
import {connect} from "react-redux";
import {mapValues, values} from "lodash";
class RecordsTable extends Component {
columns = () => {
const {accounts} = this.props;
return [
{
title : (
<FormattedMessage
defaultMessage="Amount"
id="common.amount"/>
),
dataIndex : 'formatted_value_price',
render : (text, record) => (
<span>
{record.type === 'receive' ?
<span className="cp-text-success">
{text}
</span> :
<span className="cp-text-danger">
{text}
</span>
}
</span>
)
},
{
title : (
<FormattedMessage
defaultMessage="Date"
id="widget.marketplace_earnings_chart.date"/>
),
dataIndex : 'created_at',
sorter : (a, b) => sortDate(a.created_at, b.created_at),
render : text => (
<div style={{whiteSpace : 'nowrap'}}>
{translatedFormat(text)}
</div>
),
},
{
title : 'Status',
dataIndex : 'confirmed',
render : (text) => {
const isConfirmed = text === "true" ||
(typeof text === "boolean" && text);
return (
<span>
{isConfirmed ?
<Tag color="green">
<FormattedMessage
defaultMessage="confirmed"
id="wallet.transaction_confirmed"/>
</Tag> :
<Tag color="red">
<FormattedMessage
defaultMessage="unconfirmed"
id="wallet.transaction_unconfirmed"/>
</Tag>
}
</span>
)
},
},
{
title : (
<FormattedMessage
defaultMessage="Amount"
id="common.amount"/>
),
dataIndex : 'value',
},
{
title : 'Hash',
dataIndex : 'hash',
},
{
title : 'Coin',
dataIndex : 'coin',
fixed : 'right',
onFilter : (value, record) => {
return record.coin.includes(value)
},
filters : values(mapValues(accounts, (o) => {
return {
text : o.wallet.coin.name,
value : o.wallet.coin.name
}
})),
},
];
};
render() {
const endpoint = route("user.transfer-records-table");
return (
<Widget styleName="cp-card-table"
title={
<FormattedMessage
defaultMessage="Transfer Records"
id="wallet.transfer_records"/>
}>
<AsyncTable
route={endpoint.url()}
columns={this.columns()}
className="mt-1"
scroll={{x : true, y : false}}
size="middle"/>
</Widget>
);
}
}
const mapStateToProps = ({
wallet : {accounts},
auth
}) => ({
accounts,
auth : new Auth(auth)
});
export default pipe(
injectIntl,
connect(
mapStateToProps
)
)(RecordsTable);
{translatedFormat(text)}-这是formatUtc(text)之前和工作良好。成功编译后打开网页时出现错误。这是一个星期，我试图弄清楚，但没有成功到目前为止。如有任何帮助，我将不胜感激。
任何拥有reactjs/laravel项目的人都可以通过使用utcDateCalendarTime()更改方法来解决本地化问题。所以，如果我像下面这样改变代码块，效果就像charm:
dataIndex : 'created_at',
sorter : (a, b) => sortDate(a.created_at, b.created_at),
render : text => (
<div style={{whiteSpace : 'nowrap'}}>
{utcDateCalendarTime(text)}
</div>
),
并且需要确保你正在调用文件顶部的方法:import {formatUTCDate, pipe, sortDate,utcDateCalendarTime} from "support/utils/common";