前端项目实战壹佰零玖react-admin+material ui-踩坑-react-admin之title

简介: 前端项目实战壹佰零玖react-admin+material ui-踩坑-react-admin之title


import {
    List,
    BooleanField,
    TextField,
    Datagrid,
    TextInput,
    BooleanInput
} from 'react-admin';
import IconEvent from '@mui/icons-material/Event';
import { Typography } from '@mui/material';
const postFilters = [
    <TextInput label="Search" source="q" alwaysOn />,
    <TextInput label="Title" source="title" defaultValue="Hello, World!" />,
    <BooleanInput source="is_published" alwaysOn />,
];
export const RAnyList = () => {
    return (<List title={"geyao"} sort={{ field: 'published_at', order: 'DESC' }} resource="t_geyao_person" queryOptions={{ meta: { foo: 'bar' } }}>
        <Datagrid>
            <TextField source='id'></TextField>
            <TextField source='name'></TextField>
            <TextField source='sex'></TextField>
            <TextField source='salary'></TextField>
            <BooleanField source='status'></BooleanField>
        </Datagrid>
    </List>)
}

 

相关文章
|
24天前
|
JavaScript 前端开发 API
如何在React.js中使用Shadcn/UI
学习如何在React.js中使用Shadcn/UI构建轻量且可定制的现代化界面。Shadcn/UI为React.js打造,提供核心组件和Tailwind CSS支持,帮助你创建独特的UI,避免大型框架的臃肿。本文介绍安装、配置及与Apipost集成的方法,适合希望提升React.js项目的开发者。通过定制主题和优化性能,你可以高效地开发出功能强大的应用。
|
16天前
|
前端开发 数据可视化 测试技术
React音频播放列表组件开发实战:常见问题与避坑指南
本文介绍了构建React音频播放列表组件的核心架构与常见问题解决方案。通过管理播放状态、列表索引和音频进度,结合异步控制、状态清理、节流优化等技术,确保流畅的用户体验。针对移动端兼容性、内存泄漏、列表渲染性能等问题提供了具体修复方案,并分享了自定义Hook封装、可视化音频波形等进阶实践。最后,总结了性能优化法则和测试关键点,帮助开发者打造生产级可靠的音频播放组件。
56 18
|
1月前
|
安全 前端开发 开发工具
【01】鸿蒙实战应用开发-华为鸿蒙纯血操作系统Harmony OS NEXT-项目开发实战-优雅草卓伊凡拟开发一个一站式家政服务平台-前期筹备-暂定取名斑马家政软件系统-本项目前端开源-服务端采用优雅草蜻蜓Z系统-搭配ruoyi框架admin后台-全过程实战项目分享-从零开发到上线
【01】鸿蒙实战应用开发-华为鸿蒙纯血操作系统Harmony OS NEXT-项目开发实战-优雅草卓伊凡拟开发一个一站式家政服务平台-前期筹备-暂定取名斑马家政软件系统-本项目前端开源-服务端采用优雅草蜻蜓Z系统-搭配ruoyi框架admin后台-全过程实战项目分享-从零开发到上线
75 5
【01】鸿蒙实战应用开发-华为鸿蒙纯血操作系统Harmony OS NEXT-项目开发实战-优雅草卓伊凡拟开发一个一站式家政服务平台-前期筹备-暂定取名斑马家政软件系统-本项目前端开源-服务端采用优雅草蜻蜓Z系统-搭配ruoyi框架admin后台-全过程实战项目分享-从零开发到上线
|
25天前
|
人工智能 自然语言处理 前端开发
Flame:开源AI设计图转代码模型!生成React组件,精准还原UI+动态交互效果
Flame 是一款开源的多模态 AI 模型,能够将 UI 设计图转换为高质量的现代前端代码,支持 React 等主流框架,具备动态交互、组件化开发等功能,显著提升前端开发效率。
353 1
|
3月前
|
存储 前端开发 JavaScript
前端状态管理:Vuex 核心概念与实战
Vuex 是 Vue.js 应用程序的状态管理模式和库。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。本教程将深入讲解 Vuex 的核心概念,如 State、Getter、Mutation 和 Action,并通过实战案例帮助开发者掌握在项目中有效使用 Vuex 的技巧。
|
4月前
|
缓存 前端开发 开发者
深入理解React Hooks,打造高效响应式UI
深入理解React Hooks,打造高效响应式UI
63 0
|
4月前
|
前端开发 JavaScript API
React Native实战:构建跨平台移动应用
React Native实战:构建跨平台移动应用
82 0
|
4月前
|
缓存 监控 前端开发
前端性能优化实战:从加载速度到用户体验
前端性能优化实战:从加载速度到用户体验
|
5月前
|
存储 人工智能 前端开发
前端大模型应用笔记(三):Vue3+Antdv+transformers+本地模型实现浏览器端侧增强搜索
本文介绍了一个纯前端实现的增强列表搜索应用,通过使用Transformer模型,实现了更智能的搜索功能,如使用“番茄”可以搜索到“西红柿”。项目基于Vue3和Ant Design Vue,使用了Xenova的bge-base-zh-v1.5模型。文章详细介绍了从环境搭建、数据准备到具体实现的全过程,并展示了实际效果和待改进点。
411 14
|
5月前
|
JavaScript 前端开发 程序员
前端学习笔记——node.js
前端学习笔记——node.js
93 0