React Native - 不变量违反 Objects 作为 React child 无效

Question

我尝试将我的函数称为其他组件，但我收到以下消息：

Invariant Violation: Objects are not valid as a React child (found: object with keys {years, months, days})

我的函数年龄：

export const age = date => {
  const result = { years: 0, months: 0, days: 0 };
  const now = new Date();
  let age = parseISO(date);
  const years = differenceInYears(now, age);
  if (years > 0) {
    result.years = years;
    age = addYears(age, years);
  }
  const months = differenceInMonths(now, age);
  if (months > 0) {
    result.months = months;
    age = addMonths(age, months);
  }
  const days = differenceInDays(now, age);
  if (days > 0) {
    result.days = days;
  }
  return result;
};

不可能调用这个函数？像这样:

<Caption>
  {age(//key)}
</Caption>

Answer 1

你的函数只能return一个字符串，你正在return一个对象。 React 不知道如何渲染它。

你可能应该做的是：

export const age = date => {
  const result = { years: 0, months: 0, days: 0 };
  const now = new Date();
  let age = parseISO(date);
  const years = differenceInYears(now, age);
  if (years > 0) {
    result.years = years;
    age = addYears(age, years);
  }
  const months = differenceInMonths(now, age);
  if (months > 0) {
    result.months = months;
    age = addMonths(age, months);
  }
  const days = differenceInDays(now, age);
  if (days > 0) {
    result.days = days;
  }
return `${result.years} years ${result.months} ${result.days}`
};

React Native - 不变量违反 Objects 作为 React child 无效

React Native - invariant violation Objects are not valid as a react child

javascript

object

reactjs

react-native

react-component