开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

社区首页 >问答首页 >无法映射虚拟数据

问无法映射虚拟数据
EN

Stack Overflow用户

提问于 2022-07-22 19:28:03

回答 1查看 23关注 0票数 1

我正在用前端的一些虚拟数据创建一个映射出来的组件。我有一些从js文件中提取的快速数据

export const userInputs = [
    {
        id: 1,
        label: "First Name",
        type: "text",
        placeholder: "Remy"
    },
    {
        id: 2,
        label: "Surname",
        type: "text",
        placeholder: "Sharp",
    },
    {
        id: 3,
        label: "Email",
        type: "email",
        placeholder: "remysharp@gmail.com",
    }
]

然后我把它作为“投入”的支柱，就像这样

<UserProfile inputs={userInputs}/>

我把它作为我的组件的一个道具，但是当我试图将其映射为：

              <UpdateUserDetails>

                {inputs.map((input) => (
                  <FormInput key={input.id}>
                    <UserInput type={input.type} placeholder={input.placeholder}>
                  </UserInput>
                  </FormInput>
                ))}

              </UpdateUserDetails>

我得到以下错误×TypeError:无法读取未定义的属性(读取'map')

我遗漏了什么？

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2022-07-22 20:28:23

我现在主要使用React本机(博览：https://docs.expo.dev/)，所以我的代码看起来有点不同，但似乎只是缺少索引。请随意使用以下内容

import { StyleSheet, Text, View, TouchableOpacity } from 'react-native'

export const inputs = [
  {
    id: 1,
    label: 'First Name',
    type: 'text',
    placeholder: 'Remy',
  },
  {
    id: 2,
    label: 'Surname',
    type: 'text',
    placeholder: 'Sharp',
  },
  {
    id: 3,
    label: 'Email',
    type: 'email',
    placeholder: 'remysharp@gmail.com',
  },
]

export default function App() {
  return (
    <View>
      {inputs.map((input, index) => (
        <TouchableOpacity key={input.id}>
          <Text>{inputs[index]?.label}</Text>
        </TouchableOpacity>
      ))}
    </View>
  )
}

为了简单起见，我只是将userInputs作为inputs放在同一个文件中。

我希望这能帮到你。好好休息一下吧！

票数 0

EN

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/73087822

复制

相关文章

Three TextureLoader纹理贴图不显示图片（显示黑色）的原因分析

问题在MeshLambertMaterial材质，把它改成MeshBasicMaterial即可显示图片。

Dawnzhang

2022/09/29

3.8K0

Metal Shading Language - 语法小结Metal Shading Language - 语法小结

编程算法缓存

纹理类型是一个句柄，指向一个一维/二维/三维的纹理数据;相当于OpenGL中的textureBufferID.

用户8893176

2021/08/09

1.1K0

Metal Shading Language - 语法小结Metal Shading Language - 语法小结

OpenGL学习笔记（二）——渲染管线&着色语言

导语：渲染管线（渲染流水线），一般由显示芯片（GPU）内部处理图形信号的并行处理单元组成。这些并行处理单元两两之间相互独立。不同的型号硬件上独立处理单元的数量有很大差异。与CPU串行执行不同，渲染

MelonTeam

2018/01/04

2.1K0

OpenGL学习笔记（二）——渲染管线&着色语言

Shader-基础纹理-遮罩纹理

遮罩纹理（mask texture）控制光照的强度，获得更加细腻的效果，通过遮罩纹理控制光照。在制作地形材质的时候混合多张图片，遮罩纹理控制如何混合这些纹理。通过采样得到的纹素值与某种表面属性相乘，来更加精准的控制模型表面的各种属性。在代码中添加了BumpMap来进行凹凸纹理效果，通过SpecularMask实现控制高光的光照

祝你万事顺利

2019/05/28

1.2K0

Shader-基础纹理-渐变纹理

一种基于冷暖色调的着色技术，通过渐变纹理控制漫反射光照。核心部分来说用过使用halfLambert构建一个纹理坐标，用这个纹理坐标来对渐变纹理进行采样。

祝你万事顺利

2019/05/28

1.2K0

不联网不插U盘就安全了？黑客能用声波攻击你的硬盘

安全网络安全安全漏洞大数据

《不联网不插U盘就安全了？黑客能用声波攻击你的硬盘》文章摘要：研究人员发现了一种利用声波攻击硬盘的方法，可以导致硬盘损坏和数据丢失。攻击者可以利用声波干扰机械硬盘的正常工作模式，使其产生暂时或者永久拒绝服务状态，从而阻止数据被访问。这种攻击方式需要物理接触硬盘，因此可以通过远离硬盘来避免受到攻击。研究人员建议使用加密等方法保护硬盘中的数据。

企鹅号小编

2018/01/04

1.9K0

不联网不插U盘就安全了？黑客能用声波攻击你的硬盘

WebGL2系列之采样器对象

webgl 编程算法

如果我们希望从同一个图片多次读取像素信息，但是每次读取的时候使用的过滤方式不一样, 此时我们需要创建两个不同的纹理对象。

用户3158888

2019/09/09

7600

Direct3D 11 Tutorial 7:Texture Mapping and Constant Buffers_Direct3D 11 教程7：纹理映射和常量缓冲区

在上一个教程中，我们为项目引入了照明。现在我们将通过向我们的立方体添加纹理来构建它。此外，我们将介绍常量缓冲区的概念，并解释如何使用缓冲区通过最小化带宽使用来加速处理。

Zoctopus

2018/12/06

6080

图像处理人工智能图像识别

本文介绍了纹理压缩的基本概念、原理、常用压缩方式、压缩工具及相关技术标准，旨在帮助读者了解纹理压缩的基本知识，从而更好地进行纹理压缩相关的实践。

MelonTeam

2018/01/04

1.6K0

12.QT-通过QOpenGLWidget显示YUV画面,通过QOpenGLTexture纹理渲染YUV

opengl api 网站编程算法视频处理

在上章11.QT-ffmpeg+QAudioOutput实现音频播放器,我们学习了如何播放音频,接下来我们便来学习如何通过opengl来显示YUV画面

诺谦

2020/11/04

3.9K0

12.QT-通过QOpenGLWidget显示YUV画面,通过QOpenGLTexture纹理渲染YUV

Pytorch的数据采样器

分布式批量计算

class torch.utils.data.Sampler(data_source)[source]

狼啸风云

2020/06/10

2K0

文字转语音，1行Python代码搞定，不联网也能用

语音合成开源 python

开源项目：python-office的功能一直在更新中，今天给大家发布一个新功能：文字转语音。

程序员晚枫

2023/09/06

5220

文字转语音，1行Python代码搞定，不联网也能用

CUDA优化的冷知识18| texture和surface

存储深度学习缓存

https://docs.nvidia.com/cuda/cuda-c-best-practices-guide/index.html 来阅读原文。

GPUS Lady

2021/02/05

1.2K0

OpenGL ES _ 着色器_纹理图像

玩过游戏的同学们，都知道在游戏人物身上穿的那个叫皮肤，专业点将那个就叫做纹理图像。GLSL 支持在顶点和片段着色器使用纹理图像。

酷走天涯

2018/09/14

1.3K0

Shader-高级纹理-立方体纹理

png shader 反射

是环境映射（EnvironmentMapping）一种实现方式。纹理采样：对立方体采样需要提供一个三维的纹理坐标，这个三维纹理坐标表示了我们在世界空间下的一个3D、方向。

祝你万事顺利

2019/05/29

9010

Qt官方示例-字体采样器

❝预览系列字体的例子。❞ 建立字体树显示。 QFontDatabase database; fontTree->setColumnCount(1); fontTree->setHeaderLabels(QStringList() << tr("Font")); foreach (QString family, database.families()) { const QStringList styles = database.styles(family); if (styles.i

Qt君

2023/03/17

4170

OpenGL（八）--纹理相关APIOpenGL（八）--纹理相关API

OpenGL（八）--纹理相关API 1. 原始图像数据 //存储图像数据所占内存大小 size = 图像的高度 * 图像的宽度 * 每个像素所占字节数像素所占字节数：一般为4Byte，包含RGBA四个通道，每个通道为1Byte（8Bit） 2. 认识函数像素存储方式 //改变像素存储方式 void glPixelStorei(GLenum pname,GLint param); //恢复像素存储方式 void glPixelStoref(GLenum pname,GLint param); /

用户8893176

2021/08/09

1.2K0

OpenGL（八）--纹理相关APIOpenGL（八）--纹理相关API

Metal入门教程总结

本文介绍Metal和Metal Shader Language，以及Metal和OpenGL ES的差异性，也是实现入门教程的心得总结。

落影

2018/08/21

5.1K0

纹理投影测试

GPU Gems3里有个不规则地形(X,Y,Z三个方向上都有面), 这时就没法简单地用X,Z坐标来计算UV了

逍遥剑客

2019/02/20

6630

点击加载更多

相似问题

采样器不包扎纹理

12

纹理采样器ID不映射到纹理单元

27

绑定OpenGL纹理采样器

10

对纹理采样器纹理单位值的困惑

13

纹理对象和采样器的多重纹理化理论

20

添加站长进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例