第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題,去搜搜看,總會有你想問的

App.js 的渲染方法出錯(cuò)?React-Native 問題

App.js 的渲染方法出錯(cuò)?React-Native 問題

www說 2023-03-24 13:59:29
下面粘貼的是我的代碼:import React, {useState} from 'react';import {View, StyleSheet, Flatlist, Alert} from 'react-native';import 'react-native-get-random-values';import {v4 as uuidv4} from 'uuid';import {AddTask} from './src/screens/AddTask';import {TaskList} from './src/screens/TaskList';const App = () => {  const [tasks, setTasks] = useState([{id: uuidv4(), text: 'Task 1'}]);  const deleteTask = (id) => {    setTasks((prevTasks) => {      return prevTasks.filter((task) => task.id != id);    });  };  const addTask = (text) => {    if (!text) {      Alert.alert('Error', 'Please enter a task', {text: 'Ok'});    } else {      setTask((prevTask) => {        return [{id: uuid(), text}, ...prevTask];      });    }  };  return (    <View style={styles.container}>      <AddTask addTask={addTask} />      <Flatlist        data={tasks}        renderItem={({task}) => (          <TaskList item={task} deleteTask={deleteTask} />        )}      />    </View>  );};const styles = StyleSheet.create({  container: {    flex: 1,    paddingTop: 10,  },});export default App;我的渲染方法出現(xiàn)錯(cuò)誤:錯(cuò)誤警告:React.createElement:類型無效——需要一個(gè)字符串(對于內(nèi)置組件)或一個(gè)類/函數(shù)(對于復(fù)合組件),但得到:未定義。您可能忘記從定義它的文件中導(dǎo)出您的組件,或者您可能混淆了默認(rèn)導(dǎo)入和命名導(dǎo)入。在谷歌上搜索了一下后,人們告訴我檢查我的進(jìn)口商品,但我發(fā)誓他們做對了。有人可以幫我理解這個(gè)嗎?我正在構(gòu)建一個(gè)任務(wù)管理器,我希望稍后實(shí)現(xiàn) Redux,但我只是想先構(gòu)建應(yīng)用程序:稍后添加 redux。完整的 Github 項(xiàng)目:https://github.com/calebdockal/TaskManagerApp2
查看完整描述

2 回答

?
波斯汪

TA貢獻(xiàn)1811條經(jīng)驗(yàn) 獲得超4個(gè)贊

代碼中幾乎沒有更改。


在 import 語句中刪除 AddTask 和 TaskList 周圍的大括號


import AddTask from './src/screens/AddTask';

import TaskList from './src/screens/TaskList';

在 import 語句中將 Flatlist 更改為 FlatList


import {View, StyleSheet, FlatList, Alert} from 'react-native';

并更改退貨聲明。然后將 renderItem 中的變量從任務(wù)更新為項(xiàng)目,將項(xiàng)目更新為任務(wù),如下所示


<FlatList data={tasks}

    renderItem={({item}) => (

        <TaskList task={item} deleteTask={deleteTask} />

    )}

/>

完整代碼如下


import React, {useState} from 'react';

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

import 'react-native-get-random-values';

import {v4 as uuidv4} from 'uuid';

import AddTask from './src/screens/AddTask';

import TaskList from './src/screens/TaskList';


const App = () => {

  const [tasks, setTasks] = useState([{id: uuidv4(), text: 'Task 1'}]);


  const deleteTask = (id) => {

    setTasks((prevTasks) => {

      return prevTasks.filter((task) => task.id != id);

    });

  };

  const addTask = (text) => {

    if (!text) {

      Alert.alert('Error', 'Please enter a task', {text: 'Ok'});

    } else {

      setTasks((prevTask) => {

        return [{id: uuidv4(), text}, ...prevTask];

      });

    }

  };  

  return (

    <View style={styles.container}>    

      <AddTask addTask={addTask} />

       <FlatList

          data={tasks}

          renderItem={({item}) => (

            <TaskList task={item} deleteTask={deleteTask} />

          )}

        />  

  )}

/>

    </View>

  );

};


const styles = StyleSheet.create({

  container: {

    flex: 1,

    paddingTop: 10,

  },

});


export default App;

我已經(jīng)從 github 上獲取了你的代碼并更新了代碼。你可以在這里查看 https://snack.expo.io/FbOC0J!MM


查看完整回答
反對 回復(fù) 2023-03-24
?
倚天杖

TA貢獻(xiàn)1828條經(jīng)驗(yàn) 獲得超3個(gè)贊

您需要在代碼頂部添加 import React from 'react'



查看完整回答
反對 回復(fù) 2023-03-24
  • 2 回答
  • 0 關(guān)注
  • 112 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號