Prolist组件实现动态竖排展示

实现原理:主要是利用外层div属性display:"flex",overflowX: 'auto',配合内层prolist样式属性flex:"0 0 auto",overflowX:"auto",width:"350px",height:900,实现动态竖排展示

<div style={{display:"flex",overflowX: 'auto',width:"100%"}}>{lists && lists.map((item,index)=>{console.log("item",item)return(<ProListstyle={{flex:"0 0 auto",overflowX:"auto",width:"350px",height:900}}headerTitle={item.keyword_name}metas={{title:{dataIndex:"commenter_name"},avatar:{dataIndex:"avatar_url"},description:{dataIndex:"content"}}}request={async ()=>{const params = {keyword_name:item.keyword_name}const res = await get_cars(params)return {success:true,data:res.data}}}/>)})}
</div>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/233859.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

前后端分离跨域问题的OPTIONS请求

本篇文章用于个人的问题记录 问题描述: 使用了springbootvue3做前后端分离,使用sa-token做登录认证 由于sa-token的前后端分离的登录认证需要在请求发起时自定义添加头部satoken 好那么问题来了,我请求的时候看我的请求头是存在satoken这个头部信息的 但我在springboot的拦截…

LeetCode 239 解答

给你一个整数数组 nums&#xff0c;有一个大小为 k 的滑动窗口从数组的最左侧移动到数组的最右侧。你只可以看到在滑动窗口内的 k 个数字。滑动窗口每次只向右移动一位。返回 滑动窗口中的最大值 。示例 1&#xff1a;输入&#xff1a;nums [1,3,-1,-3,5,3,6,7], k 3 输出&am…

【sprintboot+vue3】解决前后端分离项目遇到的问题

目录 一、Access to XMLHttpRequest at http://127.0.0.1:8088/api/hello from origin http://localhost:5173 has been blocked by CORS policy: No Access-Control-Allow-Origin header is present on the requested resource. 二、报错[vue/compiler-sfc] 一、Access to …

uniapp笔记

/pages/component/swiper/swiper /pages/component/button/button navigator image 设置界面标题 页面跳转 设置TabBar 发起一个请求 网络请求

明理信息科技打造专属个人或企业知识付费平台,核心功能设计

在当今信息爆炸的时代&#xff0c;知识管理已经成为了每个人必须面对的问题。然而&#xff0c;市面上的知识付费平台大多数都是通用的&#xff0c;无法满足个性化需求。 因此&#xff0c;明理信息科技提供了一款专属定制的适合个人的知识付费平台。核心产品能力如下&#xff1…

画图之C4架构图idea和vscode环境搭建篇

VS Code 下C4-PlantUML安装 安装VS Code 直接官网下载安装即可,过程略去。 安装PlantUML插件 在VS Code的Extensions窗口中搜索PlantUML,安装PlantUML插件。 配置VS Code代码片段 安装完PlantUML之后,为了提高效率,我们最好安装PlantUML相关的代码片段。 打开VS Cod…

Java精品项目源码新基于协同过滤算法的旅游推荐系统(编号V69)

Java精品项目源码新基于协同过滤算法的旅游推荐系统(编号V69) 大家好&#xff0c;小辰今天给大家介绍一个基于协同过滤算法的旅游推荐系统

VIM ——Vimtutor 个人总结【从入门到精通】

精进 Vim 编辑器技能&#xff1a;从入门到精通 文章目录 精进 Vim 编辑器技能&#xff1a;从入门到精通学习资源[Vim 自带教程中文版 —— vimtutor-CSDN博客](https://blog.csdn.net/qq_40395874/article/details/116047253)[Learn Vimscript the Hard Way (stevelosh.com)](h…

WPF Halcon机器视觉和运动控制软件通用框架,插件式开发,开箱即用 仅供学习!

点我下载&#xff0c;仅供个人学习使用 参考easyvision开发&#xff0c;集成几十个软件算子此版本以添加ui设计器。具体功能如上所示&#xff0c;可以自定义变量&#xff0c;写c#脚本&#xff0c;自定义流程&#xff0c;包含了halcon脚本和封装的算子&#xff0c;可自定义ui&a…

MySQL的增删改查(进阶)--上

1. 数据库约束 1.1 约束类型 NOT NULL - 指示某列不能存储 NULL 值。 UNIQUE - 保证某列的每行必须有唯一的值。 DEFAULT - 规定没有给列赋值时的默认值。 PRIMARY KEY - NOT NULL 和 UNIQUE 的结合。确保某列&#xff08;或两个列多个列的结合&#xff09;有唯一标识&#xf…

需要token的原因----

需要token的原因主要有以下几点&#xff1a; 安全性&#xff1a;Token的使用可以增强用户信息的安全性。在用户向服务端请求数据时&#xff0c;服务端需要通过数据库来判断用户名和密码是否正确&#xff0c;以确定是否提供所需内容。Token作为一层额外的验证&#xff0c;可以验…

kali-远程执行命令

文章目录 一、远程执行命令二、WIN10提权三、其他提权方法1.**getsystem**2.**bypassuac**3.**内核漏洞提权** 一、远程执行命令 书接上回&#xff0c;监听之后可以远程执行指令 #列出当前所在目录 meterpreter > pwd #列出本地当前所在目录 meterpreter > lpwd #跳转指…

2023中国品牌节金谱奖荣誉发布 酷开科技获颁OTT行业科技创新奖

11月17日—19日&#xff0c;以“复苏与腾飞”为主题的2023第十七届中国品牌节&#xff0c;在杭州市云栖小镇国际会展中心成功举行。在18日晚间的荣耀盛典上&#xff0c;“TopBrand 2023中国品牌节金谱奖”荣誉发布&#xff0c;酷开科技斩获OTT行业科技创新奖。 酷开科技作为OTT…

sklearn和tensorflow的理解

人工智能的实现是基于机器学习&#xff0c;机器学习的一个方法是神经网络&#xff0c;以及各种机器学习算法库。 有监督学习&#xff1a;一般数据构成是【特征值目标值】 无监督学习&#xff1a;一般数据构成是【特征值】 Scikit-learn(sklearn)的定位是通用机器学习库&…

2023/12/19 work

1. 基于UDP的TFTP文件传输 #include <stdio.h> #include <string.h> #include <stdlib.h> #include <myhead.h>//实现下载功能 int do_download(int cfd, struct sockaddr_in sin) {//定义变量存储下载请求包char buf[516] "";//定义变量存…

ubuntu22.04制作pycharm的桌面快捷方式

在Ubuntu 22.04上创建PyCharm的桌面快捷方式可以通过以下步骤完成&#xff1a; 打开终端&#xff1a;按下Ctrl Alt T组合键&#xff0c;或者在应用程序菜单中找到终端并打开。 使用以下命令进入到应用程序目录。请根据你安装PyCharm的位置进行调整&#xff0c;以下命令中的/…

工作服穿戴监测识别摄像机

工作服穿戴监测识别摄像机是一种通过图像识别技术&#xff0c;实时监测和识别工作场所穿戴的工作服是否符合要求的设备。它可以有效地监测员工是否穿戴了正确的工作服&#xff0c;提高工作场所的安全性和管理效率。 这种摄像机利用先进的计算机视觉技术&#xff0c;能够快速准确…

九牧:科技卫浴,长期主义

“没有做错什么&#xff0c;但却输给了时代”&#xff0c;这是人们给当年手机巨头诺基亚的注解。 谁也没有想到&#xff0c;曾在手机行业称雄的诺基亚&#xff0c;最终败给了时代。当年&#xff0c;在2G向3G、4G跨越的时候&#xff0c;苹果、微软的iOS和安卓系统将手机从简单的…

【QT】C++/Qt使用Qt自带工具windeployqt打包

基本操作 运行项目debug或者release 将运行后的可执行文件单独放到一个文件夹中 根据项目使用的kits来选择Qt的打包工具 打开工具后移动到exe文件夹下执行windeployqt xxx.exe 预览图 问题 打包后再其他电脑上运行出现下图错误 将自己电脑的这个文件拷到可执行文件夹中既…

redis 7.2.3 官方配置文件 redis.conf sentinel.conf

文章目录 Intro解压配置使用等官方配置文件模板redis.conf 仅配置项redis.conf 完整版(配置项注释)sentinel.conf 仅配置项sentinel.conf 完整版(配置项注释) Intro 在下载页面&#xff1a;https://redis.io/download/ 下载最新版本的redis&#xff1a; https://github.com/re…