javascript - 为什么我在使用 React-Web 时遇到这些错误

Question

所以我正在尝试完成一个 React Web 教程来学习如何制作 Android 和 iOS 应用程序，并且我一直在关注本教程:https://www.youtube.com/watch?time_continue=469&v=_CBYbEGvxYY但是当我尝试运行一个简单的页面来测试一些钩子(Hook)时:

import React, { useState } from 'react';
import logo from './logo.svg';
import { TextComponent } from 'react-native';

const App = () => {
  const[count, setCount] = useState(0);
  return (
    <view>
      <text>{count}</text>
      <button title="Increment" onKeyPress={()=> setCount(count + 1)}>Increment</button>
    </view>
  );
}

export default App;

我收到以下控制台错误:

Warning: The tag <text> is unrecognized in this browser. If you meant to render a React component, start its name with an uppercase letter.
    in text (at App.tsx:9)
    in view (at App.tsx:8)
    in App
    in div (created by View)
    in View (created by AppContainer)
    in div (created by View)
    in View (created by AppContainer)
    in AppContainer

程序根本不会增加计数。我还尝试将标签名称更改为大写，如错误所示，但这不起作用，因为标签无法识别。有人可以帮帮我吗？注意:我很困惑为什么现在会收到这些错误，因为之前我只有一个带有文本的简单 View 时，程序运行正常，但现在我收到了这些错误......

Answer 1

没有名为 <text> 的标签在 HTML 中。在视频中，他们导入了:

import { View, Text } from 'react-native';

因此，您需要确保导入和使用正确的组件。它们区分大小写:

import React, { useState } from 'react';
import logo from './logo.svg';
import { View, Text } from 'react-native';

const App = () => {
  const[count, setCount] = useState(0);
  return (
    <View>
      <Text>{count}</Text>
      <button title="Increment" onKeyPress={()=> setCount(count + 1)}>Increment</button>
    </View>
  );
}

export default App;