javascript - 在复选框选择列表中使用链接列表 react native

Question

我在我的 react native 应用程序中创建了一个链接列表数据结构，我想在屏幕之间移动它，然后根据复选框选择菜单选择一个节点。

我知道我可以使用react-native-navigation移动列表，所以现在我想用复选框列表显示列表以选择多个节点并对它们执行操作。我看到的问题是复选框列表使用定义的 const 项目数组，然后列出。

我使用链接列表的全部原因是我需要动态更新列表。 (使用大尺寸的数组可能更有利，但节点内的每个元素都有点大，我不确定大数组会产生什么效果。)

有没有办法将链接列表输入到复选框列表中，或者我必须创建一个数组吗？

如果需要动态更新，我将如何选择任一选项？

Answer 1

It may be more beneficial to use an array of large size instead, but each element within the node is somewhat large and I am unsure what effect a large array would have.

JavaScript 数组只保存对其存储的对象的引用，因为它是一种动态脚本语言，支持基于原型(prototype)的对象构造。因此，每个元素的大小不会影响数组性能。

另一种可能性是扩展链接列表数据结构中的内置 Array 类以确保兼容性。

您决定使用数组还是链接列表应基于您的应用程序最常使用的列表操作。 There are a lot of articles about that .

Is there a way to input a linked list into a checkerbox list or would I have to create an array?

How would I go about either option if they need to dynamically update?

有一些 git 存储库可以为您想要实现的目标添加支持( here is an example ，请随意探索 npm 了解更多信息)。

如果您希望项目动态更新，另一种可能性是将它们封装在 React.Component 中进行渲染:

// YourNode.js
import React, { Component } from 'react';
import { CheckBox } from 'react-native';

export default class YourNode extends Component {
  constructor(props) {
    super(props);
    this.state = {
      checked: false,
    };
  }

  selectItem = () => {
    const { onPress } = this.props;
    // Update the state
    this.setState({ checked: !this.state.checked });
    onPress();
  };

  render() {
    const { node } = this.props;
    // You may want to render more things like `Text` or `View` components based on
    // the node's content
    return (
    <CheckBox
      value={this.state.checked}
      onValueChange={this.selectItem}
    />
    );
  }
}

import YourNode from './YourNode';

// YourScreen.js

render() {
  //...
  // This will render a `YourNode` component for each one of your nodes.
  {yourList.map((item, index)) => {
      return (<YourNode node={item} onPress{() => this.selectedNodes.push(item)}>)
    }
  }
}