我正在尝试从一个名为SectionList的json文件创建一个notes.json。基本上，notes json数组中的一个对象将对应于一个SectionList条目。我已经在notesData中加载了json数组。但是，当我尝试使用notesData作为SectionList的源代码时，我会得到错误：TypeError: undefined is not an object (evaluating 'props.sections.reduce')
这是我的代码：
import React from 'react';
import { Text, View,
浏览 1提问于2018-03-12得票数 2
回答已采纳
1回答
我是比较新的React和React native，但我在填充SectionList时遇到了一个问题，还找不到解决方案。
我有一个对象数组，每个对象都有自己的数组。数据是显示此信息的理想选择，然而，每个部分的数组并不称为“SectionList”，而SectionList似乎期望每个部分中的数组具有关键的“数据”。
有没有办法告诉SectionList使用另一个键而不是数据键来填充每个部分的数组？
浏览 9提问于2018-07-24得票数 5
我需要访问有关react-native SectionList中renderItem中的节(索引、值)的信息。根据部分，可以通过renderItem函数传递详细信息。但在下面的代码中，除了该项之外，所有其他值都将被设置为未定义。有没有其他可能的方法呢？
render(){
return(
<SectionList
sections={this.props.itemList}
renderItem={(item,section) => thi
浏览 0提问于2017-10-06得票数 2
回答已采纳
我的第一个想法是尝试从嵌套列表中删除项目。我已经开始使用SectionList和一个具有管理SectionList数据更改的useState的组件。我正在尝试使用SectionList来解决这个问题，但最好能显示所有可能的备选方案(FlatList、ViewList等)。
我想出了如何删除整个章节列表(和他的项目)，而不是逐项删除。我读过很多帖子，但我没有发现任何与管理SectionList条目有关的东西。也许有一个关于FlatList嵌套项的答案。
在这里，我留下了一个可以使用的示例代码(没有样式)，该代码基于React原住民官方文档：
import React, { useEffect }
浏览 10提问于2022-09-02得票数 0
回答已采纳
如果在我的代码中有这个简单的定义：
const s = (
<SectionList
renderItem={({ item }) => <Text>abc</Text>}
renderSectionHeader={({ section }) => <Text>abc</Text>}
sections={[{ data: [1, 2, 3], title: 'abc' }]}
/>
);
流生成这个错误消息，它引用了整个“标记块”(实际上是从VSCode粘贴的副本)：
[fl
浏览 5提问于2017-10-05得票数 5
我在Support.js中有一个Support.js：
import React, {useState} from 'react';
import { StyleSheet, View, Text, Dimensions, StatusBar, SectionList, Pressable, Linking } from 'react-native';
import { DrawerActions } from '@react-navigation/native';
import MaterialIcon from 'react-nati
浏览 1提问于2022-03-20得票数 0
回答已采纳
作为学习反应的一部分，我正在开发一个示例应用程序，它有一个ColorForm，它接受来自TextInput的值，并且在Prop的帮助下，数据将被发送到Main视图，比如App。App有一个不使用来自ColorForm的新值输入进行更新的SectionList。
以下是我使用的源代码：
App.js
import React, { Component } from 'react'
import {
StyleSheet,
SectionList,
Text,
Alert
} from 'react-native'
import ColorButto
浏览 0提问于2020-01-17得票数 2
回答已采纳
我正在为创建一个包装器，它应该包含SectionList使用的所有道具，以及我的自定义道具。我如何配置类型记录呢？
以下是我的尝试：
import React from 'react';
import { SafeAreaView, SectionList } from 'react-native';
interface EnhancedSectionListProps {
...SectionListProps; // this obviously won't compile, but shows what I'm trying to
浏览 1提问于2020-05-27得票数 1
回答已采纳
升级到react native 0.59.5后，应用程序在模拟器上发出以下警告消息：
viewPagerAndroid has been extracted from react-native core...
但是组件文件中没有导入viewPagerAndroid：
import React, { Component} from 'react';
import { SectionList, View, StyleSheet, Text, TouchableOpacity, Platform, AppRegistry } from 'react-native';
浏览 0提问于2019-03-20得票数 6
回答已采纳
我已经尝试过Flatlist、SectionList、Animated.Flatlist和Animated.SectionList，下面是一个简单的示例如何检查scrollToLocation：
<SectionList
onLayout={this.onLayout.bind(this)}
ref={ref => {
this.sectionList = ref
console.log('ref.scrollToLocation: ' + CircularJSON.stringify(ref.scrollToLocatio
浏览 0提问于2019-02-10得票数 1
如何在React Native中使用SectionList中的复选框进行选中或取消选中。而不使用第三方模块。
浏览 0提问于2018-04-28得票数 0
3回答
目前，我正试图在经典的<SectionList>中使用<View>，我的所有数据都是格式化的，列表显示正确，我的项目的操作也正常。
问题是，当我在我的SectionList顶部时，可以触发滚动的区域实际上很小(大约是列表顶部的100个像素)。但是，一旦我从该区域向下滚动，整个列表就可以滚动，并按预期工作，直到我滚动回顶部。
我的父视图有flex: 1和SectionList
环境
工作环境: MacOS塞拉利昂10.13.3
世博版: 23.0
React本地版本: 0.50
反应: 16.0
使用IPhone 8仿真
Android没有问题
复制的步骤
视图内部Sec
浏览 1提问于2018-03-30得票数 2
我有3个文件，它们使用相同的导入语句，每个文件：
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { Dimensions, Keyboard, SectionList, Text, TextInput, TouchableOpacity, View } from 'react-native';
import { Entypo, EvilIcons } from 'react-native-vector-icon
浏览 1提问于2017-09-23得票数 1
回答已采纳
我不确定这是否是我的错误，因为我找不到我在文档和视频中使用的代码和代码之间的任何区别。
我有一段代码，它使用SectionList来显示数据，这些数据是被安排好的，并使用lodash的groupBy和reduce方法打包到数组中。
import React, { Component } from 'react';
import {
Platform,
StyleSheet,
Text,
ScrollView,
Button,
Picker,
SectionList
} from 'react-native';
import MapV
浏览 0提问于2018-03-12得票数 0
回答已采纳
我有一个包含核心组件SectionList的React Native页面。SectionList具有粘性部分页眉(stickySectionHeadersEnabled)和列表页脚(ListFooterComponent)。当用户滚动经过最后一节时，最后一节页眉仍然停留在页面顶部，覆盖页脚。然而，我更希望粘性标题包含在小节列表区域的主体中，而不是停留在屏幕上超过最后一节的结尾。 有没有可能用SectionList来实现这一点，或者我应该采取另一种方法？ 展示这一行为的世博会小吃(仅限iOS和安卓) https://snack.expo.io/@unstableair/rn-sectionli
浏览 30提问于2020-04-16得票数 1
我正在从服务器获取数据，但正在加载没有指示器的数据，如何向代码中添加指示符？在从服务器获取之前，我需要显示加载指示符。不幸的是，我不知道如何创建一个加载器来等待数据加载。这是我目前的代码。
这里是我的代码
import { SectionList, Alert, ActivityIndicator } from 'react-native'
import Icon from 'react-native-vector-icons/Ionicons';
import styled from 'styled-components/native';
im
浏览 3提问于2020-02-03得票数 0
如何将对象键呈现为SectionList标头？这样我就可以在昨天的基础上制作部分。下面我提供了一个对象，其中对象在Lodash的帮助下按日期分组，日期使用moment进行格式化 代码链接：Snack expo 对象： {
"18-Apr-2021": [
{
"id": 1,
"title": "Spotify Premium",
"amount": -9.99,
"payType
浏览 20提问于2021-04-18得票数 1
回答已采纳
我刚开始对本机做出反应，发现如果我在react native SectionList组件滚动之前使用renderSectionHeader道具，那么这种奇怪的行为就不起作用。
垂直滚动不工作
<SectionList
sections={DATA}
renderSectionHeader={({ section }) => (
<View style={styles.item}>
<Text style={styles.text}>{section.title}</Text>
浏览 5提问于2021-09-02得票数 0
2回答
如何从选项列表中计算价格？
、、、、
我正在通过尝试做一个美食应用程序来学习expo的原生反应。现在我正在构建Extras屏幕，客户可以在其中添加奶酪、培根等到他的订单中。为了呈现我正在使用的SectionList选项。一切看起来都很好，但是我如何正确地编写加号和减号按钮的逻辑代码，使其更改“0”？如何读取这些值并乘以每个价格，以获得正确的订单NOW值？我现在真的迷路了。 ? import React, { Component } from 'react';
import { Container, Header, Title, Content, Footer, FooterTab, Button, Lef
浏览 20提问于2020-06-14得票数 0
我尝试在sectionlist中呈现一个dropdown-picker (react-native-dropdownpicker)，但无法滚动下拉列表中的内容。它只显示第一个结果。
我用zIndex尝试了很多东西，用flex: 1作为父视图，但我找不到解决方案。
是否可以在sectionlist中渲染，或者我是否应该寻找其他解决方案？
浏览 25提问于2021-09-15得票数 1
根据FB文档，你可以在react原生的SectionList中覆盖renderItem默认的基于项目的渲染来使用基于节的渲染，但我还没有找到这样做的方法。请帮帮忙。
浏览 0提问于2021-05-25得票数 2
2回答
如何映射此数组中的所有名称
、、、、
import React, { useState } from 'react';
import {View, StyleSheet, Button, FlatList, SectionList} from 'react-native';
import { Item, Input, Container, Header, List, ListItem, Text, Left, Right, Icon } from "native-base";
const NigLawList= ({navigation}) => {
const
浏览 15提问于2020-11-03得票数 0
回答已采纳
我从服务器接收到以下JSON作为响应： [
{
"VehicleId":278,
"VehicleName":"AhmedGMC",
"VehicleStatus":"PARKED",
"Latitude":29.178666,
"Longitude":48.108431,
"RecentCommunication":"2021-06-07T05:39:20",
浏览 30提问于2021-06-17得票数 1
回答已采纳
我的RN (0.59.9)应用程序中有一个Event组件。以下是代码的构造函数部分：
import React, { Component} from 'react';
import { SectionList, View, Image, StyleSheet, Text, TouchableOpacity, Platform, TouchableHighlight, AppRegistry } from 'react-native';
import {Icon } from "react-native-elements";
import Devi
浏览 6提问于2019-08-07得票数 0
<SectionList
sections={[{ data: [1, 2] }, { data: [3, 4] }]}
renderItem={({ item, index }) => ...}
renderSectionHeader={({ section, index }, i) => {
console.log(index, i); // both undefined
}}
/>
我想要在renderSectionHeader中获取该部分的索引。
例如：当section.data为[1, 2]时，index应为0；当section.dat
浏览 0提问于2018-05-12得票数 12
1回答
我想在React Native中使用情感。我能够让它在styled-components上工作，但不能在emotion上工作。我也在使用styled-system来设置我的UI系统。
我正在设置一个样式系统，如下所示：
import React from 'react';
import * as N from 'react-native';
// import styled from 'styled-components';
import styled from '@emotion/native';
import {
co
浏览 4提问于2019-10-25得票数 0
2回答
如何获得反应元件的高度？我想使用一个组件的高度值作为其他组件的填充值，如何在react本机中这样做？例如，我从
import { Picker } from '@react-native-picker/picker';
我想用填充值<view>制作一个padding:{Picker}.height组件，怎么做呢？
更新
感谢@A似乎Gautam和@Aniket，我已经尝试了Picker组件的解决方案，但是它不起作用，当我尝试使用View组件时，它工作得很好。为什么会发生这种事？这是否意味着Picker组件不继承视图道具？这里是我尝试过的代码
import React
浏览 1提问于2021-05-29得票数 3
我实际上是从移动开发和React Native开始的，我想一个名为Vasern的有趣的数据库，但现在我试图用componentDidMount()方法从我的数据库加载东西，但实际上我每次都会得到这个错误。我确信这只是一个小错误，但我就是找不到…… 提前感谢 ? import React, {Component} from 'react';
import {
StyleSheet,
Text,
View,
TextInput,
Button,
SectionList
} from 'react-native';
i
浏览 11提问于2019-01-11得票数 2
回答已采纳
1回答
我们可以在SectionList中添加像这样的库的标签吗？我试过上面的库，它已经过时了，不能工作。谁能指导我如何在部分列表中将标题显示为选项卡？我在React网站上读到了Section的官方文档，它没有正式的这个功能。我在Github上找到了这个库，但我认为它不适用于最新的expo版本。我正在为我的react原生项目使用expo 36。
我的区段列表编码：
import React from 'react';
import {
StyleSheet,
Text,
View,
SafeAreaView,
SectionList,
} from 'rea
浏览 18提问于2020-03-13得票数 3
1回答
我正在我的React Native项目中使用Redux，我想要一些转换数据以进行渲染的建议。我有一个我认为是规范化的userDetails对象，格式如下： "userDetails": Object {
"allIds": Array [
"111",
"222",
"333",
],
"byId": Object {
"111": Object {
"name": "B
浏览 19提问于2020-10-02得票数 1
回答已采纳
有没有办法在滚动时知道React Native的SectionList中当前的第一行？我想根据活动部分更改另一个组件。
浏览 1提问于2018-01-03得票数 5
回答已采纳
我想在react本机中显示来自我的API的数据，使用Sectionlist，但是我不知道如何生成sectionData。我认为我的数据太复杂，无法理解，也让我感到困惑。结构如下所示
"Info": [
{
"Name": "test1",
"Data": [
{
"sss": "1215",
"aaa": &#
浏览 0提问于2019-07-01得票数 0
回答已采纳
作为学习react-native的一部分，我在原生iOS (TableView或CollectionView)或安卓应用程序(RecycleView)中试验各种功能。我已经用SectionList和FlatList实现了一个示例屏幕，现在我想为SectionList中的项目或部分提供不同的高度。 参考各种博客，我看到了一个在GitHub 'https://github.com/jsoendermann/rn-section-list-get-item-layout‘中提供的包。有人能建议我实现这些功能的标准方法是什么吗？这个包似乎是两年前的最后一次更新，所以我不喜欢它，而是寻找标准的
浏览 18提问于2020-01-20得票数 0
我现在有一个SectionList。我想将所有项目包装在FlatList中的一个部分中。例如，对于Queues Near You部分，Tonkotsu、Burgerville和Fries的三个RestaurantCards应该在一个水平的FlatList中，Restaraunt、B、C应该在它自己的FlatList中，等等。我如何实现这一点？
const sectionData = [
{
title: "Queues Near You",
data: ["Tonkotsu", "BurgerVille", "Frie
浏览 12提问于2022-10-20得票数 0
我在React中有这个简单的组件--本机，我的目标是跳过迭代，如果给定的参数gradeIsMandatory是假的，那么它只应该在Per修保证和价格上迭代，我如何在不影响性能的情况下实现这个结果？我会接受任何建议，谢谢
import React, { useCallback } from 'react';
import { View, Text, SafeAreaView, SectionList, StyleSheet, Image, TouchableOpacity, Alert} from 'react-native';
export con
浏览 5提问于2022-02-08得票数 0
回答已采纳
我正在使用react本机循环来显示节头和数据。
我的预期产出如下：
> 0节
data1 data2
>第1节
data1 data2
>第2节
data1 data2
，它将根据循环号来循环该部分。
但是，实际输出如下：
它只显示最后一个循环值。
import React, { Component } from 'react';
import { Text, StyleSheet, View, SafeAreaView, SectionList } from 'react-native';
export defaul
浏览 5提问于2020-02-16得票数 0
回答已采纳
3回答
我在reducer中的初始状态如下所示 const initialState = {
medicationschedule: [
{
date: '2019-08-27',
medications: [
{
title: '8.00 AM',
data: [
{name:'item1', isTaken: 1,mg
浏览 20提问于2019-08-27得票数 0
回答已采纳
1回答
更新：I只是从一个区段列表切换到一个滚动视图，并且状态正确地更新了。我不明白Pure组件的原理，这也是它没有被重新复制的原因。
我对自然的反应很新，我用redux和诸如此类的方法解决了很多问题。但是，我似乎无法理解为什么当状态发生变化时，我的组件没有更新。我不确定需要多少信息，所以我将尝试将注释放在应该重点关注的代码中。
复选框是从api调用动态呈现的。然后，我使用该数据创建一个具有传递给复选框的真/假值的项的列表。列表中的键与每个复选框都具体相关联。我试图保持尽可能的动态，以允许后端数据的更改。当按下复选框时，复选调度按预期触发并更新状态，但复选框没有更新以反映该状态。打印checkedLi
浏览 1提问于2018-08-12得票数 0
1回答
我正在学习反应本地应用程序。我从开源应用中找到了一个关于FlatList的演示应用程序，用户可以在这里点击屏幕的下边和屏幕的上方。我希望在SectionList中实现相同的逻辑，根据React本机文档，FlatList和SectionList几乎有相同的道具。但是，当我尝试实现向下滚动和向上按钮逻辑SectionList时，它不起作用。这让我犯了错误。下面是他们使用的，FlatList向下滚动和向上滚动逻辑。
这里是我对SectionList 和 的失败尝试
import React from "react";
import {
StyleSheet,
Text,
浏览 8提问于2022-11-23得票数 1
回答已采纳
这是我的问题。我需要使用react导航器使用FLatList或SectionList使用route.params输入适当的数据。
通常情况下，这对我来说没有问题，但是我想要一个更复杂的列表，列表中有新的列表(理想的情况是在将来使用json )。我想要做一个列表，显示和排序动物的类别，以列出的格式。当你触摸到想要的动物时，你会被转发到一个页面，上面显示动物的信息和事实。
数据列表看起来如下(它的缩写，但这是模板)：
const species= [
{
title: 'SpeciesGroup1',
data: [
浏览 3提问于2022-05-01得票数 0
描述
我在ListHeaderComponent中使用水平选项卡，我希望在SectionList中将ListHeaderComponent作为一个粘性头。我们可以用stickyHeaderIndices={[0]}制作平面图中的粘贴头，但在SectionList中不起作用。
React本地版本：
React Native Environment Info:
System:
OS: macOS 10.14.6
CPU: (12) x64 Intel(R) Core(TM) i7-8850H CPU @ 2.60GHz
Memory: 38.35 MB
浏览 5提问于2020-08-02得票数 2
我在同一问题上发现了很多问题，但似乎没有一个问题能解决问题。目前，我正在使用redux来获取一个对象数组，操作该数据以匹配SectionList数据reqs，并将其提供给SectionList部分支柱。在RenderItem中，我使用FlatList并输入项目支持sections.data。最后，renderItem in FLatList是一个PureComponent。我尝试过使用shouldComponentUpdate，以及其他人推荐的许多其他支持，但似乎都没有用。SectionList一致地呈现项3次或更多次。这是我的密码：
// SECTION LIST COMPONENT
im
浏览 0提问于2019-06-11得票数 0
在<SectionList/>中，我尝试向renderItems添加一个图像源。问题是出现了这个错误：Device: (1052:8812) Error: Module ../assets/filter-imgs/local@2x.png not declared as a System.registerDynamic dependency of module://screens/ConsumerHome.js.js。 我怀疑这个错误是由于react-native组件无法注册任何非硬编码(即this.props.img)图像源，除非它们是System.registerDynami
浏览 17提问于2019-06-15得票数 2
我对一个很长的区域列表有异议，它超出了视图范围，我如何使它正常工作呢？我试过使用flexShrink:1，但没有成功。我尝试过的其他解决方案是使用<ScrollView>，但它给了我错误的VirtualizedLists should never be nested inside plain ScrollViews with the same orientation because it can break windowing and other functionality - use another VirtualizedList-backed container instead
浏览 7提问于2021-06-01得票数 1
0回答
我使用的是React Native的SectionList。发送到SectionList的数据如下所示
data: [
{
title: "Asia",
data: ["Taj Mahal", "Great Wall of China", "Petra"]
},
{
title: "South America",
data: ["Machu Picchu", "Christ the Redeemer", "
浏览 5提问于2018-07-09得票数 2
回答已采纳
我想在我的MessageDialog中保存对this.SectionList上的SectionList的推荐。我尝试在第31行定义允许SectionList的接口，但没有效果。我该怎么办？
TypeScript抱怨说：MessageDialog.tsx(132,38): error TS2339: Property 'SectionList' does not exist on type 'SkademeldingDialog'
29 interface IComponentProps {
30 navigation: NavigationScreenP
浏览 1提问于2017-12-14得票数 0
回答已采纳
2回答
我对这件事很陌生。我得到了一个选择项目的问题，并回发到特定索引单元格(重新加载)的表视图。场景:我有两个视图控制器，两个都包含tableview。
FirstViewController:我已经在将webservice中的数据显示到Tableview中，但是对于不同的操作类型，我使用了didSelectRow函数，该函数显示给ListViewController进行项选择。在FirstViewController中，主要模型是单元。
ListViewController:简单列表的数据显示在tableView中供选择。
问题：是如何从ListViewController中选择项并将数据传递给在
浏览 1提问于2019-11-29得票数 1
1回答
遵循React本机教程，我无法获得显示的数据。
当我执行console.log时，我的数据如下所示：
Array [
Object {
"data": Object {
"address": "8753 2nd Street",
"id": "5507",
"inspection_date": "2019-03-27",
"inspection_time": "07:00:00",
浏览 0提问于2019-04-26得票数 2
回答已采纳
1回答
我对包含在<SectionList />中的多个<Switch />组件的当前值具有如下初始状态：
this.state = {
switchValues:[
[true],
[false, true], //i want to amend 'true' to be 'false'
[false],
],
};
如何使用setState将switchValues[1][1]中的项目更新为false？
还有其他类似问题的答案，例如，但问题与嵌套对象有关，而不是数组
从链接的答案中获取我能想到的答案
this.
浏览 3提问于2018-02-23得票数 1
回答已采纳
1回答
我正在尝试在原生react中实现MultiSelect。我从这个链接引用了“”。但不幸的是，我无法在显示“No item to display”的下拉列表中查看名称。
图片：
对于要在下拉列表中显示的名称，从项目prop中获取数据，该项目应该是javascript对象数组的形式。请帮我解决这个问题。
import React, {Component} from 'react';
import { SectionList, Image, StyleSheet, Text, View, ScrollView, ListView,
AsyncStorage, Button
浏览 2提问于2017-10-09得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
