JS 根据后台数据结构实现句子分段需求的思路（数据结构转换）

"data": [
{
"id": 582,
"bigQuestionIndex": 0,
"paragraphIndex": 0,
"sentenceIndex": 0,
"type": "essay",
"sentenceWords": [
"",
"",
"Whatever",
"is",
"worth",
"doing",
"is",
"worth",
"doing",
"well",
"."
],
"passageId": 46,
"questionId": null,
"version": 1
},
{
"id": 583,
"bigQuestionIndex": 0,
"paragraphIndex": 0,
"sentenceIndex": 1,
"type": "essay",
"sentenceWords": [
"Happiness",
"is",
"a",
"way",
"station",
"between",
"too",
"much",
"and",
"too",
"little",
"."
],
"passageId": 46,
"questionId": null,
"version": 1
},
{
"id": 584,
"bigQuestionIndex": 0,
"paragraphIndex": 0,
"sentenceIndex": 2,
"type": "essay",
"sentenceWords": [
"In",
"love",
"folly",
"is",
"always",
"sweet",
"."
],
"passageId": 46,
"questionId": null,
"version": 1
},
{
"id": 585,
"bigQuestionIndex": 0,
"paragraphIndex": 1,
"sentenceIndex": 0,
"type": "essay",
"sentenceWords": [
"",
"",
"Love",
"is",
"not",
"a",
"maybe",
"thing",
"."
],
"passageId": 46,
"questionId": null,
"version": 1
},
{
"id": 586,
"bigQuestionIndex": 0,
"paragraphIndex": 1,
"sentenceIndex": 1,
"type": "essay",
"sentenceWords": [
"You",
"know",
"when",
"you",
"love",
"someone",
"!"
],
"passageId": 46,
"questionId": null,
"version": 1
},
{
"id": 587,
"bigQuestionIndex": 0,
"paragraphIndex": 1,
"sentenceIndex": 2,
"type": "essay",
"sentenceWords": [
"Time",
"goes",
"by",
"so",
"fast",
",",
"people",
"go",
"in",
"and",
"out",
"of",
"your",
"life",
"?"
],
"passageId": 46,
"questionId": null,
"version": 1
},
{
"id": 588,
"bigQuestionIndex": 0,
"paragraphIndex": 1,
"sentenceIndex": 3,
"type": "essay",
"sentenceWords": [
"You",
"must",
"never",
"miss",
"the",
"opportunity",
"to",
"tell",
"these",
"people",
"how",
"much",
"they",
"mean",
"to",
"you",
"."
],
"passageId": 46,
"questionId": null,
"version": 1
},
{
"id": 589,
"bigQuestionIndex": 0,
"paragraphIndex": 2,
"sentenceIndex": 0,
"type": "essay",
"sentenceWords": [
"",
"",
"Love",
"is",
"not",
"a",
"maybe",
"thing",
","
],
"passageId": 46,
"questionId": null,
"version": 1
},
{
"id": 590,
"bigQuestionIndex": 0,
"paragraphIndex": 2,
"sentenceIndex": 1,
"type": "essay",
"sentenceWords": [
"You",
"know",
"when",
"you",
"love",
"someone",
"!"
],
"passageId": 46,
"questionId": null,
"version": 1
},
{
"id": 591,
"bigQuestionIndex": 0,
"paragraphIndex": 2,
"sentenceIndex": 2,
"type": "essay",
"sentenceWords": [
"Time",
"goes",
"by",
"so",
"fast",
",",
"people",
"go",
"in",
"and",
"out",
"of",
"your",
"life",
"……"
],
"passageId": 46,
"questionId": null,
"version": 1
},
{
"id": 592,
"bigQuestionIndex": 0,
"paragraphIndex": 2,
"sentenceIndex": 3,
"type": "essay",
"sentenceWords": [
"You",
"must",
"never",
"miss",
"the",
"opportunity",
"to",
"tell",
"these",
"people",
"how",
"much",
"they",
"mean",
"to",
"you",
";"
],
"passageId": 46,
"questionId": null,
"version": 1
},
{
"id": 593,
"bigQuestionIndex": 0,
"paragraphIndex": 100,
"sentenceIndex": 0,
"type": "topic",
"sentenceWords": [
"1.",
"Lily",
"was",
"so",
"___",
"looking",
"at",
"the",
"picture",
"that",
"she",
"forgot",
"the",
"time",
"."
],
"passageId": 46,
"questionId": null,
"version": 1
},
{
"id": 594,
"bigQuestionIndex": 0,
"paragraphIndex": 101,
"sentenceIndex": 0,
"type": "option",
"sentenceWords": [
"[A].",
"carefully"
],
"passageId": 46,
"questionId": 593,
"version": 1
},
{
"id": 595,
"bigQuestionIndex": 0,
"paragraphIndex": 102,
"sentenceIndex": 0,
"type": "option",
"sentenceWords": [
"[B].",
"careful"
],
"passageId": 46,
"questionId": 593,
"version": 1
},
{
"id": 596,
"bigQuestionIndex": 0,
"paragraphIndex": 103,
"sentenceIndex": 0,
"type": "option",
"sentenceWords": [
"[C].",
"busily"
],
"passageId": 46,
"questionId": 593,
"version": 1
},
{
"id": 597,
"bigQuestionIndex": 0,
"paragraphIndex": 104,
"sentenceIndex": 0,
"type": "option",
"sentenceWords": [
"[D].",
"busy"
],
"passageId": 46,
"questionId": 593,
"version": 1
},
{
"id": 598,
"bigQuestionIndex": 0,
"paragraphIndex": 200,
"sentenceIndex": 1,
"type": "topic",
"sentenceWords": [
"2.",
"Putting",
"paper",
"cuts",
"on",
"the",
"windows",
"______",
"good",
"luck",
"."
],
"passageId": 46,
"questionId": null,
"version": 1
},
{
"id": 599,
"bigQuestionIndex": 0,
"paragraphIndex": 201,
"sentenceIndex": 1,
"type": "option",
"sentenceWords": [
"[A].",
"means"
],
"passageId": 46,
"questionId": 598,
"version": 1
},
{
"id": 600,
"bigQuestionIndex": 0,
"paragraphIndex": 202,
"sentenceIndex": 1,
"type": "option",
"sentenceWords": [
"[B].",
"meaning"
],
"passageId": 46,
"questionId": 598,
"version": 1
},
{
"id": 601,
"bigQuestionIndex": 0,
"paragraphIndex": 203,
"sentenceIndex": 1,
"type": "option",
"sentenceWords": [
"[C].",
"to",
"mean"
],
"passageId": 46,
"questionId": 598,
"version": 1
},
{
"id": 602,
"bigQuestionIndex": 0,
"paragraphIndex": 204,
"sentenceIndex": 1,
"type": "option",
"sentenceWords": [
"[D].",
"mean"
],
"passageId": 46,
"questionId": 598,
"version": 1
}
]

1.根据后台返回的数据 数组对象中 paragraphIndex 相同的视为同一自然段的内容，sentenceWords 的内容拼接到一起 在html上渲染成一个自然段

2.选中该自然段的某个单词的时候，能够知道这个句子的id 是那个

也就是 582 583 这些值 然后去请求接口

现在能拼接成句子 但是 每一个自然段的所有句子的id 都是默认第一个的id

求如果实现 sentenceWords 拼接一起 但是 id 仍旧能对应到各自没有组合之前的
最好能得到如下结果
{

        "id": 582,
"bigQuestionIndex": 0,
"paragraphIndex": 0,
"sentenceIndex": 0,
"type": "essay",
"sentenceWords": [
{
id:582,
content:[]
},
{
{
id:583,
content:[] //content都是paragraphIndex相等的
},
}
],
"passageId": 46,
"questionId": null,
"version": 1
},

`

回答

要看你怎么渲染的，假如你把自然段等同于 <p> 的话，无非就是侦听 <p> 的 select event，然后从 event.target 里取出对应的自然段的 id，然后请求接口即可。

之前看的时候，我就有点疑惑，你会不会用到id，因为你给的结果，就只是将sentenceWords的拼接，如果现在要这样的结构：

sentenceWords: [
    {
        id: xx,
        content: xx
    }
]

你将之前的方法把返回结构处理一下，就OK的

以上是 JS 根据后台数据结构实现句子分段需求的思路（数据结构转换） 的全部内容， 来源链接： utcz.com/a/20362.html

回到顶部