#yyds干货盘点# react笔记之学习之空列表提示

落魄码农在线炒粉 lv.1

发布时间：2022-12-30 15:01:07 263

相关标签： # 前端# css# 服务器# 容器# 数据

前言

我是歌谣我有个兄弟巅峰的时候排名c站总榜19 叫前端小歌谣曾经我花了三年的时间创作了他现在我要用五年的时间超越他今天又是接近兄弟的一天人生难免坎坷大不了从头再来歌谣的意志是永恒的放弃很容易但是坚持一定很酷微信公众号前端小歌谣关注公众号带你进入前端学习交流群

#yyds干货盘点# react笔记之学习之空列表提示_数据

log.js

/* 日志的容器 */
import LogItem from "./LogItem/LogItem";
import Card from "../UI/Card/Card";
import './Logs.css';

const Logs = (props) => {

    /*
    *   logsDate 用来存储学习的日志，
    *       这个数据除了当前组件Logs需要使用外，LogsForm也需要使用
    *       当遇到一个数据需要被多个组件使用时，我们可以将数据放入到这些组件共同的祖先元素中
    *       这样就可以使得多个组件都能方便的访问到这个数据
    *
    *   state的提升
    *
    * */
    // 模拟一组从服务器中加载的数据


    // 将数据放入JSX中
    let logItemData = props.logsData.map(
        (item, index) =>             onDelLog={() => props.onDelLog(index)}
            key={item.id}
            date={item.date}
            desc={item.desc}
            time={item.time}/>
    );

    if (logItemData.length === 0) {
        logItemData = 没要找到日志！
;
    }

    return 
        {
            logItemData
            // logItemData.length !== 0 ? logItemData : 没要找到日志！

            // logsData.map(item =>  )
        }
    
};

export default Logs;

文章来源： https://blog.51cto.com/u_14476028/5965046

特别声明：以上内容（图片及文字）均为互联网收集或者用户上传发布，本站仅提供信息存储服务！如有侵权或有涉及法律问题请联系我们。