如何在我的React应用程序中使用猪拉丁语翻译器npm模块

我需要编写一个React/Redux应用程序来将英语句子翻译成猪拉丁语。我发现有一些已经存在的npm modules用于此目的，因此考虑重新使用它们。我为此翻译编写了一个简单的功能组件，如下所示。如何在我的React应用程序中使用猪拉丁语翻译器npm模块

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.But时，我尝试了这一点它适用于硬编码的文本改变它按照下面的答案后。

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

我想是因为我们缺少围绕text.Finally ''我能够通过使用ES6回剔操作如下，以解决这一问题出现此错误。

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

您可能会在github上找到我的代码here。我怎样才能解决这个问题。任何帮助真的很感激。

后来，我发现还有另一个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 
    }; 
}

来源

2017-04-08 Ravindra Ranwala

望着那模块的文档是看起来应该是

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

不

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

来源

2017-04-08 04:48:46 Jayce444

你的答案是正确的。感谢您指出了这一点。但我现在有另一个问题，我更新了问题。你可以看看。 –

我能够在ES6中使用back-tick“'运算符来解决问题。谢谢。 –

如何在我的React应用程序中使用猪拉丁语翻译器npm模块

回答

相关问题