node.js - 如何在我的 React 应用程序中使用 Pig 拉丁语翻译器 npm 模块

Question

我需要编写一个 React/Redux 应用程序将英语句子翻译成 Pig Latin。我发现有一些已经存在的npm modules为此目的，因此想到重用它们。我为此翻译编写了一个简单的功能组件，如下所示。

import _ from 'lodash';
import React from 'react';
import piglatin from 'piglatin';

function convertToPigLatin(data){
  // https://www.npmjs.com/package/piglatin
  // return pigLatin(data);
}

export default (props) => {
  console.log(props.data);
  console.log(piglatin('hello there'));  // Works fine
  console.log(piglatin(props.data));    // gives an ERROR
  return (
    <label>Hello !</label>
  )
}

我只是想将翻译后的文本记录到控制台中。但是当我尝试这样做时，它在按照下面的答案更改后适用于硬编码文本。

console.log(piglatin('hello there'));  // Works fine

但是当我传递真实数据时，它无法给我这个错误。

console.log(piglatin(props.data));    // gives an ERROR

Uncaught TypeError: Cannot read property 'split' of null at piglatin

我认为发生此错误是因为我们在文本周围缺少 ''。最后我能够通过使用 ES6 反引号运算符解决该问题，如下所示。

console.log(piglatin(`${props.data}`));    // This solved the issue

您可能会找到我的代码 here在github上。我该如何解决这个问题。非常感谢任何帮助。

后来发现还有一个npm module出于同样的目的，这也是一个很酷的目的。两者都会给你相同的结果，因此你可以使用它们中的任何一个。代码略有不同，我已将其发布在下面。

import pigLatin from 'piglatin';

export const PIG_LATIN = 'PIG_LATIN';

export function pigLatinConvert(input){
  console.log(input);
  const output = pigLatin(`${input.inputtext}`);
  console.log(output);
  return {
    type: PIG_LATIN,
    payload: output
  };
}

Answer 1

查看该模块的文档看起来应该是这样

console.log(piglatin(props.data));

不是

console.log(piglatin.piglatin(props.data));