Question

我是react-native的新手，我正在尝试使用react-native-ui-kitten库。问题在于该文档并没有真正的帮助。

我已经安装了ui-kitten并按照命令指示的主题安装了npm i react-native-ui-kitten @eva-design/eva

文档要求配置应用程序根目录，除非我错了，否则我认为它是App.js文件。

因此，我将App.js生成的代码更改为此：

import React from 'react';
import {
  mapping,
  theme,
} from '@eva-design/eva';
import { ApplicationProvider } from 'react-native-ui-kitten';
import { Application } from './path-to/root.component';

export default class App extends React.Component {

   public render(): React.ReactNode {
     return (
       <ApplicationProvider
         mapping={mapping}
         theme={theme}>
         <Application/>
       </ApplicationProvider>
     );
   }
}

很不幸，它无法正常工作。

最近有人使用过ui-kitten库吗？

该文档对“应用程序根目录”意味着什么，以及如何设置一个简单的本机项目以使用react-native-ui-kitten？

是的，我实际上检查了文档，但也许有些事情我做得不对。

Answer 1

我遇到了同样的问题。我发现该UI工具包的创建者实际上在其代码示例Typescript中使用了它。因此，您需要使用Typescript模板重新创建Reactnative项目，然后将App.js相应地重命名为App.tsx 其他任何组件都需要使用扩展名.tsx重命名。确保您已阅读有关Typescript的内容：

https://www.typescriptlang.org

这是使用Typescript重新创建项目的方法：

https://facebook.github.io/react-native/blog/2018/05/07/using-typescript-with-react-native

祝一切顺利，

Answer 2

我还是react-native的初学者，似乎我们在实现代码方面有点不同。我不确定这是否有帮助，但这是我实现代码的方式：

import * as React from 'react';
import { mapping, light as lightTheme } from '@eva-design/eva';
import { ApplicationProvider } from 'react-native-ui-kitten';
import { Application } from './path-to/root.component';

const App = () => (
    <ApplicationProvider
        mapping={mapping}
        theme={lightTheme}>
        <Application/>
    </ApplicationProvider>
);

export default App;

您可以尝试一下，让我知道是否适合您。祝你好运！

如何在react-native中配置App.js以使用React-native-ui-kitten？

2 个答案: