如何在React.js中的数组数据内部排列数组?

时间:2019-03-01 11:39:41

标签: javascript arrays reactjs

我内部有一个数组,我内部有多个数组,我试图在数组中安排该数组,但我不知道这是什么问题?那么如何在数组内部正确设置数组呢?下面的arrayData可用。

const webpack = require('webpack');
const path = require('path');

const HtmlWebPackPlugin = require('html-webpack-plugin');

const htmlPlugin = new HtmlWebPackPlugin({
  template: './source/index.html',
  filename: 'index.html',
});

const buildPlugin = new webpack.DefinePlugin({
  BUILD_INFO: JSON.stringify('BUILD-000'),
});

module.exports = {
  entry: './source/client.js',
  output: {
    path: path.resolve('build'),
    filename: 'bundled.js',
    publicPath: '/',
  },
  module: {
    rules: [
      {
        test: /\.js$|\.jsx$/,
        exclude: /node_modules/,
        use: {
          loader: 'babel-loader',
        },
      },
    ],
  },
  resolve: {
    alias: {
      api: path.resolve(__dirname, './source/js/api'),
      config: path.resolve(__dirname, './source/js/config'),
      components: path.resolve(__dirname, './source/js/components'),
      init: path.resolve(__dirname, './source/js/init'),
      context: path.resolve(__dirname, './source/js/context'),
      views: path.resolve(__dirname, './source/js/views'),
      utilities: path.resolve(__dirname, './source/js/utilities'),
      helpers: path.resolve(__dirname, './source/js/helpers'),
      store: path.resolve(__dirname, './source/js/store'),
      styles: path.resolve(__dirname, './source/styles'),
    },
    extensions: ['.js', '.jsx'],
  },
  plugins: [htmlPlugin, buildPlugin],
  watchOptions: {
    aggregateTimeout: 300,
    poll: 1000,
  },
  devServer: {
    disableHostCheck: true,
    historyApiFallback: true,
    port: 80,
    hot: false,
    host: '0.0.0.0',
    stats: {
      assets: true,
      children: false,
      chunks: false,
      hash: false,
      modules: false,
      publicPath: false,
      timings: true,
      version: false,
      warnings: true,
      colors: true,
    },
  },
};

3 个答案:

答案 0 :(得分:1)

应该是这样的:

const arrayData = [
     form_id : 1,
     countTotal: 100,
     formName: 'Application Form',
     questions: [
                 [
                   questionName => 'what is your name ?',
                   note => 'give firstname middlename and lastname also..',
                   required => true,
                   answer => 'my name is khan, but i am not terrorist',
                   sequence => 0,
                   questionType => 'long text',
                   options => [], 
                 ],
                 [
                   questionName => 'select your gender ?',
                   note => '',
                   required => true,
                   answer => 'Male',
                   sequence => 1,
                   questionType => 'Single Selector',
                   options => [
                       { option_id: 1,
                         value: 'Male',
                         sequence: 0,
                         is_selected: true,
                       },
                       { option_id: 2,
                         value: 'female',
                         sequence: 1,
                         is_selected: false,
                       },
                       { option_id: 3,
                         value: 'Other',
                         sequence: 2,
                         is_selected: false,
                       },
                   ], 
                 ]
                ]
   ]

您不应该手动提供索引,因为它已经自动注册。

array = ['data index 0','data index 1','data index 2'];

此外,您可以使用以下方法注册自己的索引:

array = [index1 => 'data index 1', index2 => 'data index 2'];

答案 1 :(得分:1)

尽管[]用于数组,但是您的数组不包含数组项,而是更多的字典项。因此,可以使用{}括号将其设置为字典,或者添加类似的项,这将使您的数组成为字典的列表

 [
     {form_id : 1},
     {countTotal: 100},
      ....
 ] 

对于array中的array,添加如下

questions: [{  
                 questionName: 'what is your name ?',
                 note: 'give firstname middlename and lastname also..',
                 required: true,
                 answer: 'my name is John dao',
                 sequence: 0,
                 questionType: 'long text',
                 options: [], 
        },
        ....
        ]

答案 2 :(得分:0)

    您尝试创建的
  1. arrayData不是数组,而是对象。因此,内容应位于{}中,而不应位于[]中。

更新:如果它实际上是一个包含此类对象的数组,则需要在该数组中放置一个对象。

[a: 1, b: 2]   // wrong
[{a: 1, b: 2}] // correct
    questions这样的
  1. 属性是数组的类型,但是您要设置。您不能像那样手动进行。
[0: 1, 1: 2] // wrong
[1, 2]       // correct
  1. questions的项目应该是一个对象,因此其内容应该在{}中,而不在[]中。
[a: 1, b: 2] // wrong
{a: 1, b: 2} // correct

const arrayData = [{
  form_id: 1,
  countTotal: 100,
  formName: 'Application Form',
  questions: [{
      questionName: 'what is your name ?',
      note: 'give firstname middlename and lastname also..',
      required: true,
      answer: 'my name is khan, but i am not terrorist',
      sequence: 0,
      questionType: 'long text',
      options: [],
    },
    {
      questionName: 'select your gender ?',
      note: '',
      required: true,
      answer: 'Male',
      sequence: 1,
      questionType: 'Single Selector',
      options: [{
          option_id: 1,
          value: 'Male',
          sequence: 0,
          is_selected: true,
        },
        {
          option_id: 2,
          value: 'female',
          sequence: 1,
          is_selected: false,
        },
        {
          option_id: 3,
          value: 'Other',
          sequence: 2,
          is_selected: false,
        },
      ],
    }
  ]
}]

console.log(arrayData)