繁体   English   中英

如何在平面列表中分别 select 单选按钮 react-native

[英]How to select radio buttons separately in a flatlist react-native

我从带有问题和问题选项的 api 获取数据。 每个问题都有 4 个选项可供选择。 我已将结果呈现在平面列表中。 当我 select 单选按钮时,我无法保存每个问题的值。 看看我的代码:

const Step3 = () => {
  const [questions, setQuestions] = useState([]);
  const [values, setValue] = useState()
  const getQuestions = async () => {
    const locale = 'sq'; // TODO: get current locale
    const response = await apiStandarts.get(`/questions?locale=${locale}`, {
      params: { _limit: MAX_QUESTIONS, active: 1, _sort:'sortId:ASC' },
    });
    setQuestions(response.data);
  };
  
  useEffect(() => {
    getQuestions();
  }, []);

  const OptionList = (groupOption) => {
    return (
      <FlatList
        data={groupOption.options}
        keyExtractor={(result) => result.id.toString()}
        renderItem={({ item, index}) => {
          const clickedRadio = () => {
            setValue(item.id)
          }
          return (
            <View key={index}>
              <Radio label={item.description} onChange={()=> clickedRadio() } />
            </View>
          );
        }}
      />
    );
  };

  return (
    <View style={styles.container}>
      <Text style={{ fontWeight: "bold", fontSize: 16, color: "#6B24AA" }}>
        {t("Choose an option/Scroll for more questions")}
      </Text>
      <FlatList
        data={questions}
        keyExtractor={(result) => result.id.toString()}
        renderItem={({ item, index }) => {
          return (
            <View style={styles.groupOptions} key={index}>
              <Text>{item.description}</Text>
              <OptionList options={item?.question_options}></OptionList>
            </View>
          );
        }}
      />
    </View>

  )
}

下面是数据结构:

[
   {
      "id":11,
      "description":"A ka organizata juaj politika dhe procedura të brendshme organizative si pjesë e të cilave parashikohet qartë mënyra e ngritjes së fondeve dhe e manaxhimit të tyre në mënyrë etike?",
      "active":true,
      "sortId":11,
      "locale":"sq",
      "published_at":"2021-06-10T13:56:39.618Z",
      "created_at":"2021-06-10T13:56:36.456Z",
      "updated_at":"2021-10-06T09:18:29.403Z",
      "organization_evaluation":null,
      "questId":11,
      "question_options":[
         {
            "id":44,
            "question":11,
            "description":"Organizata ka politika dhe procedura të brendshme organizative si pjesë e të cilave parashikohet shumë qartë mënyra e ngritjes së fondeve dhe e manaxhimit të tyre në mënyrë etike.",
            "points":4,
            "active":true,
            "icon":null,
            "locale":"sq",
            "published_at":"2021-06-10T14:15:34.685Z",
            "created_at":"2021-06-10T14:15:31.675Z",
            "updated_at":"2021-12-06T09:53:00.315Z",
            "question_option_suggestion":{
               "id":53,
               "question_option":44,
               "description":"Kjo është një praktikë shumë e mirë  për mundësimin e qendrueshmërisë organizative dhe transparencën e llogaridhënien më të gjithë grupet e interesit. Është e rëndësishme që këto procese të mbahen dhe mësimet e nxjerra të ndahen, në mënyrë që organizatat e tjera të mund të ndjekin këtë shembull. ",
               "active":true,
               "locale":"sq",
               "published_at":"2021-11-24T13:20:34.873Z",
               "created_at":"2021-11-22T13:55:53.026Z",
               "updated_at":"2021-12-06T09:53:00.317Z"
            },
            "organization_evaluation":null,
            "questOptionId":44,
            "sort":4
         },
         {
            "id":41,
            "question":11,
            "description":"Organizata nuk ka politika dhe procedura të tilla.",
            "points":1,
            "active":true,
            "icon":null,
            "locale":"sq",
            "published_at":"2021-06-10T14:13:20.937Z",
            "created_at":"2021-06-10T14:13:17.713Z",
            "updated_at":"2021-12-06T09:51:40.886Z",
            "question_option_suggestion":{
               "id":50,
               "question_option":41,
               "description":"Të paturit e praktikave të qarta dhe të formalizuara për mbledhjen e fondeve dhe përdorimin e menaxhimin etik të tyre, është një praktikë e këshillueshme pasi përbën një mjet për rritjen e qendrueshëmrisë së organizatës, uljen e varësisë nga një burim i caktuar fondesh, dhe krijimin e mundësisë për të qenë novator e i suksesshëm. Gjithashtu këto praktika garantojnë njohjen gjerësisht të burimeve nga të gjitha palët e interesuara. Kjo do të sjellë më shumë transparencë dhe të përmirësojë përgjegjshmërinë.",
               "active":true,
               "locale":"sq",
               "published_at":"2021-11-24T13:20:22.267Z",
               "created_at":"2021-11-22T13:54:07.049Z",
               "updated_at":"2021-12-06T09:51:40.889Z"
            },
            "organization_evaluation":null,
            "questOptionId":41,
            "sort":1
         },
         {
            "id":42,
            "question":11,
            "description":"Organizata nuk ka politika dhe procedura të tilla por ndjek disa parime të përgjithshme etike në ngritjen e fondeve dhe manaxhimin e tyre.",
            "points":2,
            "active":true,
            "icon":null,
            "locale":"sq",
            "published_at":"2021-06-10T14:13:57.687Z",
            "created_at":"2021-06-10T14:13:49.677Z",
            "updated_at":"2021-12-06T09:52:12.383Z",
            "question_option_suggestion":{
               "id":51,
               "question_option":42,
               "description":"Të paturit e praktikave të qarta dhe të formalizuara për mbledhjen e fondeve dhe përdorimin e menaxhimin etik të tyre, është një praktikë e këshillueshme pasi përbën një mjet për rritjen e qendrueshëmrisë së organizatës, uljen e varësisë nga një burim i caktuar fondesh, dhe krijimin e mundësisë për të qenë novator e i  suksesshëm. Gjithashtu këto praktika garantojnë njohjen gjerësisht të burimeve nga të gjitha palët e interesuara. Kjo do të sjellë më shumë transparencë dhe të përmirësojë përgjegjshmërinë.",
               "active":true,
               "locale":"sq",
               "published_at":"2021-11-24T13:20:26.501Z",
               "created_at":"2021-11-22T13:54:46.944Z",
               "updated_at":"2021-12-06T09:52:12.385Z"
            },
            "organization_evaluation":null,
            "questOptionId":42,
            "sort":2
         },
         {
            "id":43,
            "question":11,
            "description":"Organizata ka politika dhe procedura të brendshme organizative si pjesë e të cilave ka parashikime të përgjithshme mbi mënyrën e ngritjes së fondeve.",
            "points":3,
            "active":true,
            "icon":null,
            "locale":"sq",
            "published_at":"2021-06-10T14:14:54.428Z",
            "created_at":"2021-06-10T14:14:51.561Z",
            "updated_at":"2021-12-06T09:52:39.514Z",
            "question_option_suggestion":{
               "id":52,
               "question_option":43,
               "description":"Zhvillimi dhe përditësimi i vazhdueshëm i praktikave të tilla, në varësi dhe të dinamikave zhvillimore të organizatës, siguron një përqasje novatore lidhur me garantimin e qendrueshmërisë së organizatës. Këshillohet që këto politika të jenë të mirë detajuara, duke mundësuar jo vetëm një njohje sa më të gjerë nga të gjithë grupet e interesit në kuadër të transparencës dhe llogaridhënies, por dhe zbatim të saktë të tyre në të gjithë nivelet hirarkike.",
               "active":true,
               "locale":"sq",
               "published_at":"2021-11-24T13:20:31.381Z",
               "created_at":"2021-11-22T13:55:27.990Z",
               "updated_at":"2021-12-06T09:52:39.518Z"
            },
            "organization_evaluation":null,
            "questOptionId":43,
            "sort":3
         }
      ],
      "commitments":[
         {
            "id":5,
            "name":"Financim, Ngritje Fondesh dhe Manaxhim i Burimeve",
            "icon":"fa-pencil",
            "primary_color":"#348D73",
            "secondary_color":"#06C088",
            "active":true,
            "published_at":"2021-05-13T08:09:20.077Z",
            "created_at":"2021-05-13T08:09:11.107Z",
            "updated_at":"2021-07-26T10:25:26.204Z",
            "icon_color":"#33D0A1",
            "locale":"sq",
            "commitments_icon":5,
            "commitment_icon":5,
            "color_palette":"light_blue",
            "link":"/financing",
            "sortId":3
         }
      ]
   },
   {
      "id":13,
      "description":"A kryen organizata juaj vlerësime periodike të performancës të punonjësve dhe si? ",
      "active":true,
      "sortId":13,
      "locale":"sq",
      "published_at":"2021-06-10T13:57:37.862Z",
      "created_at":"2021-06-10T13:57:34.723Z",
      "updated_at":"2021-10-06T09:18:57.834Z",
      "organization_evaluation":null,
      "questId":13,
      "question_options":[
         {
            "id":51,
            "question":13,
            "description":"Vlerësimi i performancës së punonjësve bëhet periodikisht me afate të përcaktuara, , përmes një procedure të formalizuar,  por vetëm nga drejtuesi i organizatës.",
            "points":3,
            "active":true,
            "icon":null,
            "locale":"sq",
            "published_at":"2021-06-10T14:20:35.874Z",
            "created_at":"2021-06-10T14:19:48.983Z",
            "updated_at":"2021-12-06T09:55:01.718Z",
            "question_option_suggestion":{
               "id":60,
               "question_option":51,
               "description":"Kjo është një praktikë e mirë organizative e cila mund të përmirësohet më tej me përfshirjen në procedurë jo vetëm të drejtuesit të organizatës por dhe niveleve të tjera të hierarkisë. Kjo përfshirje ofron një këndvështrim më të gjerë të vlerësimit të përformancës në raport dhe me pjesën tjetër të stafit kryesisht supervizues. ",
               "active":true,
               "locale":"sq",
               "published_at":"2021-11-24T13:21:05.079Z",
               "created_at":"2021-11-22T14:02:42.810Z",
               "updated_at":"2021-12-06T09:55:01.724Z"
            },
            "organization_evaluation":null,
            "questOptionId":51,
            "sort":3
         },
         {
            "id":49,
            "question":13,
            "description":"Organizata jonë nuk kryen vlerësime periodike të  performancës së punonjësve.",
            "points":1,
            "active":true,
            "icon":null,
            "locale":"sq",
            "published_at":"2021-06-10T14:19:03.812Z",
            "created_at":"2021-06-10T14:18:56.048Z",
            "updated_at":"2021-12-06T09:54:26.197Z",
            "question_option_suggestion":{
               "id":58,
               "question_option":49,
               "description":"Vlerësimi i performancës së burimeve njerëzore është një aspekt shumë i rëndësishëm për të analizuar ecurinë e organizatës, rregullimet e mundshme që mund të nevojiten, si dhe për të mbledhur komente dhe sugjerime nga stafi dhe vullnetarët e organizatës. Kryerja e një praktike të tillë është shumë e këshillueshme të zhvillohet.",
               "active":true,
               "locale":"sq",
               "published_at":"2021-11-24T13:20:55.365Z",
               "created_at":"2021-11-22T13:59:19.528Z",
               "updated_at":"2021-12-06T09:54:26.199Z"
            },
            "organization_evaluation":null,
            "questOptionId":49,
            "sort":1
         },
         {
            "id":50,
            "question":13,
            "description":"Organizata jonë kryen vlerësime periodike të performancës të punonjësve por jo sipas një planifikimi dhe procedure të formalizuar.",
            "points":2,
            "active":true,
            "icon":null,
            "locale":"sq",
            "published_at":"2021-06-10T14:19:36.859Z",
            "created_at":"2021-06-10T14:19:30.174Z",
            "updated_at":"2021-12-06T09:54:43.753Z",
            "question_option_suggestion":{
               "id":59,
               "question_option":50,
               "description":"Vlerësimi i performancës së burimeve njerëzore është një aspekt shumë i rëndësishëm për të analizuar ecurinë e organizatës, rregullimet e mundshme që mund të nevojiten, si dhe për të mbledhur komente dhe sugjerime nga stafi dhe vullnetarët e organizatës. Kryerja e një praktike të tillë është shumë e këshillueshme të zhvillohet, sipas një procedure të formalizuar në mënyrë periodike.",
               "active":true,
               "locale":"sq",
               "published_at":"2021-11-24T13:20:59.427Z",
               "created_at":"2021-11-22T13:59:50.511Z",
               "updated_at":"2021-12-06T09:54:43.755Z"
            },
            "organization_evaluation":null,
            "questOptionId":50,
            "sort":2
         },
         {
            "id":52,
            "question":13,
            "description":"Vlerësimi i performancës së punonjësve bëhet periodikisht me afate të përcaktuara, , përmes një procedure të formalizuar me përfshirjen dhe vlerësimin e punonjësit dhe të gjitha niveleve hirearkike.",
            "points":4,
            "active":true,
            "icon":null,
            "locale":"sq",
            "published_at":"2021-06-10T14:20:57.838Z",
            "created_at":"2021-06-10T14:20:54.741Z",
            "updated_at":"2021-12-06T09:55:18.506Z",
            "question_option_suggestion":{
               "id":61,
               "question_option":52,
               "description":"Vlerësimi periodik i performancës së punonjësve, nëpërmjet një procedure të formalizuar dhe me përfshirjen e të gjitha niveleve hierarkike, është një praktikë e mirë institucionale. Është e rëndësishme që këto praktika të zhvillohen më tej dhe mësimet e nxjerra gjatë ngritjes së tyre të ndahen, kështu që organizatat e tjera mund të ndjekin këtë shembull.",
               "active":true,
               "locale":"sq",
               "published_at":"2021-11-24T13:21:08.716Z",
               "created_at":"2021-11-22T14:03:21.740Z",
               "updated_at":"2021-12-06T09:55:18.508Z"
            },
            "organization_evaluation":null,
            "questOptionId":52,
            "sort":4
         }
      ],
      "commitments":[
         {
            "id":6,
            "name":"Burime Njerëzore të Mirë Menaxhuara",
            "icon":"fa-pencil",
            "primary_color":"#03BEE7",
            "secondary_color":"#428D9D",
            "active":true,
            "published_at":"2021-05-13T08:10:12.178Z",
            "created_at":"2021-05-13T08:10:08.282Z",
            "updated_at":"2021-07-26T10:25:12.028Z",
            "icon_color":"#027A95",
            "locale":"sq",
            "commitments_icon":6,
            "commitment_icon":6,
            "color_palette":"dark_blue",
            "link":"/managed-human-resources",
            "sortId":7
         }
      ]
   }
]

这是数据的 json 格式

假设服务器返回此响应:


[
   {
      "id":11,
      "description":"A ka organizata juaj politika dhe procedura të brendshme organizative si pjesë e të cilave parashikohet qartë mënyra e ngritjes së fondeve dhe e manaxhimit të tyre në mënyrë etike?",
      "active":true,
      "sortId":11,
      "locale":"sq",
      "published_at":"2021-06-10T13:56:39.618Z",
      "created_at":"2021-06-10T13:56:36.456Z",
      "updated_at":"2021-10-06T09:18:29.403Z",
      "organization_evaluation":null,
      "questId":11,
      "question_options":[
         {
            "id":44,
            "question":11,
            "description":"Organizata ka politika dhe procedura të brendshme organizative si pjesë e të cilave parashikohet shumë qartë mënyra e ngritjes së fondeve dhe e manaxhimit të tyre në mënyrë etike.",
            "points":4,
            "active":true,
            "icon":null,
            "locale":"sq",
            "published_at":"2021-06-10T14:15:34.685Z",
            "created_at":"2021-06-10T14:15:31.675Z",
            "updated_at":"2021-12-06T09:53:00.315Z",
            "question_option_suggestion":{
               "id":53,
               "question_option":44,
               "description":"Kjo është një praktikë shumë e mirë  për mundësimin e qendrueshmërisë organizative dhe transparencën e llogaridhënien më të gjithë grupet e interesit. Është e rëndësishme që këto procese të mbahen dhe mësimet e nxjerra të ndahen, në mënyrë që organizatat e tjera të mund të ndjekin këtë shembull. ",
               "active":true,
               "locale":"sq",
               "published_at":"2021-11-24T13:20:34.873Z",
               "created_at":"2021-11-22T13:55:53.026Z",
               "updated_at":"2021-12-06T09:53:00.317Z"
            },
            "organization_evaluation":null,
            "questOptionId":44,
            "sort":4
         },
         {
            "id":41,
            "question":11,
            "description":"Organizata nuk ka politika dhe procedura të tilla.",
            "points":1,
            "active":true,
            "icon":null,
            "locale":"sq",
            "published_at":"2021-06-10T14:13:20.937Z",
            "created_at":"2021-06-10T14:13:17.713Z",
            "updated_at":"2021-12-06T09:51:40.886Z",
            "question_option_suggestion":{
               "id":50,
               "question_option":41,
               "description":"Të paturit e praktikave të qarta dhe të formalizuara për mbledhjen e fondeve dhe përdorimin e menaxhimin etik të tyre, është një praktikë e këshillueshme pasi përbën një mjet për rritjen e qendrueshëmrisë së organizatës, uljen e varësisë nga një burim i caktuar fondesh, dhe krijimin e mundësisë për të qenë novator e i suksesshëm. Gjithashtu këto praktika garantojnë njohjen gjerësisht të burimeve nga të gjitha palët e interesuara. Kjo do të sjellë më shumë transparencë dhe të përmirësojë përgjegjshmërinë.",
               "active":true,
               "locale":"sq",
               "published_at":"2021-11-24T13:20:22.267Z",
               "created_at":"2021-11-22T13:54:07.049Z",
               "updated_at":"2021-12-06T09:51:40.889Z"
            },
            "organization_evaluation":null,
            "questOptionId":41,
            "sort":1
         },
         {
            "id":42,
            "question":11,
            "description":"Organizata nuk ka politika dhe procedura të tilla por ndjek disa parime të përgjithshme etike në ngritjen e fondeve dhe manaxhimin e tyre.",
            "points":2,
            "active":true,
            "icon":null,
            "locale":"sq",
            "published_at":"2021-06-10T14:13:57.687Z",
            "created_at":"2021-06-10T14:13:49.677Z",
            "updated_at":"2021-12-06T09:52:12.383Z",
            "question_option_suggestion":{
               "id":51,
               "question_option":42,
               "description":"Të paturit e praktikave të qarta dhe të formalizuara për mbledhjen e fondeve dhe përdorimin e menaxhimin etik të tyre, është një praktikë e këshillueshme pasi përbën një mjet për rritjen e qendrueshëmrisë së organizatës, uljen e varësisë nga një burim i caktuar fondesh, dhe krijimin e mundësisë për të qenë novator e i  suksesshëm. Gjithashtu këto praktika garantojnë njohjen gjerësisht të burimeve nga të gjitha palët e interesuara. Kjo do të sjellë më shumë transparencë dhe të përmirësojë përgjegjshmërinë.",
               "active":true,
               "locale":"sq",
               "published_at":"2021-11-24T13:20:26.501Z",
               "created_at":"2021-11-22T13:54:46.944Z",
               "updated_at":"2021-12-06T09:52:12.385Z"
            },
            "organization_evaluation":null,
            "questOptionId":42,
            "sort":2
         },
         {
            "id":43,
            "question":11,
            "description":"Organizata ka politika dhe procedura të brendshme organizative si pjesë e të cilave ka parashikime të përgjithshme mbi mënyrën e ngritjes së fondeve.",
            "points":3,
            "active":true,
            "icon":null,
            "locale":"sq",
            "published_at":"2021-06-10T14:14:54.428Z",
            "created_at":"2021-06-10T14:14:51.561Z",
            "updated_at":"2021-12-06T09:52:39.514Z",
            "question_option_suggestion":{
               "id":52,
               "question_option":43,
               "description":"Zhvillimi dhe përditësimi i vazhdueshëm i praktikave të tilla, në varësi dhe të dinamikave zhvillimore të organizatës, siguron një përqasje novatore lidhur me garantimin e qendrueshmërisë së organizatës. Këshillohet që këto politika të jenë të mirë detajuara, duke mundësuar jo vetëm një njohje sa më të gjerë nga të gjithë grupet e interesit në kuadër të transparencës dhe llogaridhënies, por dhe zbatim të saktë të tyre në të gjithë nivelet hirarkike.",
               "active":true,
               "locale":"sq",
               "published_at":"2021-11-24T13:20:31.381Z",
               "created_at":"2021-11-22T13:55:27.990Z",
               "updated_at":"2021-12-06T09:52:39.518Z"
            },
            "organization_evaluation":null,
            "questOptionId":43,
            "sort":3
         }
      ],
      "commitments":[
         {
            "id":5,
            "name":"Financim, Ngritje Fondesh dhe Manaxhim i Burimeve",
            "icon":"fa-pencil",
            "primary_color":"#348D73",
            "secondary_color":"#06C088",
            "active":true,
            "published_at":"2021-05-13T08:09:20.077Z",
            "created_at":"2021-05-13T08:09:11.107Z",
            "updated_at":"2021-07-26T10:25:26.204Z",
            "icon_color":"#33D0A1",
            "locale":"sq",
            "commitments_icon":5,
            "commitment_icon":5,
            "color_palette":"light_blue",
            "link":"/financing",
            "sortId":3
         }
      ]
   },
   {
      "id":13,
      "description":"A kryen organizata juaj vlerësime periodike të performancës të punonjësve dhe si? ",
      "active":true,
      "sortId":13,
      "locale":"sq",
      "published_at":"2021-06-10T13:57:37.862Z",
      "created_at":"2021-06-10T13:57:34.723Z",
      "updated_at":"2021-10-06T09:18:57.834Z",
      "organization_evaluation":null,
      "questId":13,
      "question_options":[
         {
            "id":51,
            "question":13,
            "description":"Vlerësimi i performancës së punonjësve bëhet periodikisht me afate të përcaktuara, , përmes një procedure të formalizuar,  por vetëm nga drejtuesi i organizatës.",
            "points":3,
            "active":true,
            "icon":null,
            "locale":"sq",
            "published_at":"2021-06-10T14:20:35.874Z",
            "created_at":"2021-06-10T14:19:48.983Z",
            "updated_at":"2021-12-06T09:55:01.718Z",
            "question_option_suggestion":{
               "id":60,
               "question_option":51,
               "description":"Kjo është një praktikë e mirë organizative e cila mund të përmirësohet më tej me përfshirjen në procedurë jo vetëm të drejtuesit të organizatës por dhe niveleve të tjera të hierarkisë. Kjo përfshirje ofron një këndvështrim më të gjerë të vlerësimit të përformancës në raport dhe me pjesën tjetër të stafit kryesisht supervizues. ",
               "active":true,
               "locale":"sq",
               "published_at":"2021-11-24T13:21:05.079Z",
               "created_at":"2021-11-22T14:02:42.810Z",
               "updated_at":"2021-12-06T09:55:01.724Z"
            },
            "organization_evaluation":null,
            "questOptionId":51,
            "sort":3
         },
         {
            "id":49,
            "question":13,
            "description":"Organizata jonë nuk kryen vlerësime periodike të  performancës së punonjësve.",
            "points":1,
            "active":true,
            "icon":null,
            "locale":"sq",
            "published_at":"2021-06-10T14:19:03.812Z",
            "created_at":"2021-06-10T14:18:56.048Z",
            "updated_at":"2021-12-06T09:54:26.197Z",
            "question_option_suggestion":{
               "id":58,
               "question_option":49,
               "description":"Vlerësimi i performancës së burimeve njerëzore është një aspekt shumë i rëndësishëm për të analizuar ecurinë e organizatës, rregullimet e mundshme që mund të nevojiten, si dhe për të mbledhur komente dhe sugjerime nga stafi dhe vullnetarët e organizatës. Kryerja e një praktike të tillë është shumë e këshillueshme të zhvillohet.",
               "active":true,
               "locale":"sq",
               "published_at":"2021-11-24T13:20:55.365Z",
               "created_at":"2021-11-22T13:59:19.528Z",
               "updated_at":"2021-12-06T09:54:26.199Z"
            },
            "organization_evaluation":null,
            "questOptionId":49,
            "sort":1
         },
         {
            "id":50,
            "question":13,
            "description":"Organizata jonë kryen vlerësime periodike të performancës të punonjësve por jo sipas një planifikimi dhe procedure të formalizuar.",
            "points":2,
            "active":true,
            "icon":null,
            "locale":"sq",
            "published_at":"2021-06-10T14:19:36.859Z",
            "created_at":"2021-06-10T14:19:30.174Z",
            "updated_at":"2021-12-06T09:54:43.753Z",
            "question_option_suggestion":{
               "id":59,
               "question_option":50,
               "description":"Vlerësimi i performancës së burimeve njerëzore është një aspekt shumë i rëndësishëm për të analizuar ecurinë e organizatës, rregullimet e mundshme që mund të nevojiten, si dhe për të mbledhur komente dhe sugjerime nga stafi dhe vullnetarët e organizatës. Kryerja e një praktike të tillë është shumë e këshillueshme të zhvillohet, sipas një procedure të formalizuar në mënyrë periodike.",
               "active":true,
               "locale":"sq",
               "published_at":"2021-11-24T13:20:59.427Z",
               "created_at":"2021-11-22T13:59:50.511Z",
               "updated_at":"2021-12-06T09:54:43.755Z"
            },
            "organization_evaluation":null,
            "questOptionId":50,
            "sort":2
         },
         {
            "id":52,
            "question":13,
            "description":"Vlerësimi i performancës së punonjësve bëhet periodikisht me afate të përcaktuara, , përmes një procedure të formalizuar me përfshirjen dhe vlerësimin e punonjësit dhe të gjitha niveleve hirearkike.",
            "points":4,
            "active":true,
            "icon":null,
            "locale":"sq",
            "published_at":"2021-06-10T14:20:57.838Z",
            "created_at":"2021-06-10T14:20:54.741Z",
            "updated_at":"2021-12-06T09:55:18.506Z",
            "question_option_suggestion":{
               "id":61,
               "question_option":52,
               "description":"Vlerësimi periodik i performancës së punonjësve, nëpërmjet një procedure të formalizuar dhe me përfshirjen e të gjitha niveleve hierarkike, është një praktikë e mirë institucionale. Është e rëndësishme që këto praktika të zhvillohen më tej dhe mësimet e nxjerra gjatë ngritjes së tyre të ndahen, kështu që organizatat e tjera mund të ndjekin këtë shembull.",
               "active":true,
               "locale":"sq",
               "published_at":"2021-11-24T13:21:08.716Z",
               "created_at":"2021-11-22T14:03:21.740Z",
               "updated_at":"2021-12-06T09:55:18.508Z"
            },
            "organization_evaluation":null,
            "questOptionId":52,
            "sort":4
         }
      ],
      "commitments":[
         {
            "id":6,
            "name":"Burime Njerëzore të Mirë Menaxhuara",
            "icon":"fa-pencil",
            "primary_color":"#03BEE7",
            "secondary_color":"#428D9D",
            "active":true,
            "published_at":"2021-05-13T08:10:12.178Z",
            "created_at":"2021-05-13T08:10:08.282Z",
            "updated_at":"2021-07-26T10:25:12.028Z",
            "icon_color":"#027A95",
            "locale":"sq",
            "commitments_icon":6,
            "commitment_icon":6,
            "color_palette":"dark_blue",
            "link":"/managed-human-resources",
            "sortId":7
         }
      ]
   }
]

我们需要构建与问题相对应的选定选项的新数组。


import React, {useState} from 'react'
import {View,FlatList,StyleSheet,Text} from 'react-native'
import {RadioButton} from "react-native-paper"
const  has = require('lodash.has');
import response from './response'

const styles = StyleSheet.create({})



const  Step3 = () => {
  const [questions, setQuestions] = useState(response);

  const [answers,setAnswers] = useState({})
  const [values, setValue] = useState()


 const isOptionSelected = (option)=>{

   const answer = answers[option.question]

  if(answer){
   return   option.id == answer.id
  }

return false
 }

  const OptionList = (groupOption) => {
    return (
      <FlatList
        data={groupOption.options}
        keyExtractor={(result) => result.id.toString()}
        renderItem={({ item, index}) => {

       
          const clickedRadio = () => {
      
         const selectedOption = {[item.question]:{...item}}
            setAnswers({...answers,...selectedOption})


            console.log({answers})


            
          }

          

 const status = isOptionSelected(item)? 'checked' : 'unchecked'
          return (
            <View key={index}>
              <RadioButton status={status}   onPress={clickedRadio} label={item.description} onChange={()=> clickedRadio() } />
            </View>
          );
        }}
      />
    );
  };

  return (
    <View style={styles.container}>
      <Text style={{ fontWeight: "bold", fontSize: 16, color: "#6B24AA" }}>
        Choose an option/Scroll for more questions
      </Text>
      <FlatList
        data={questions}
        keyExtractor={(result) => result.id.toString()}
        renderItem={({ item, index }) => {
          return (
            <View style={styles.groupOptions} key={index}>
              <Text>{item.description}</Text>
              <OptionList options={item?.question_options}></OptionList>
            </View>
          );
        }}
      />
    </View>

  )
}


export default Step3


为简单起见,我删除了从服务器获取数据的逻辑。

在此处检查工作示例

https://snack.expo.dev/@emmbyiringiro/1376bf

您需要为每个选项组选择值,这可以通过在初始值 state 中使用 Object 来实现:

const [values, setValue] = useState({})然后更新 OptionsList props 以接受另外两个 props,onSelect 和 isSelected。

<OptionList options={item?.question_options} selectedId={value[item?.id]} onSelect={(optionId)=>{ setValue(prevValues=>({...prevValues, [item?.id]:optionId})) }}/>

在 OptionList 组件中,您需要使用来自 props item.id===selectedIdselectedId为活动选项添加特定样式,并且在 select 上,您将使用选项 Id 作为参数调用onSelect道具。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM