Necesito mostrar los datos creados en una aplicación móvil flutter usando este editor . Como sé, el editor implementado en las aplicaciones móviles usará Markdown. Por el momento la estructura de datos es un poco compleja y es algo como esto:

 { "title": "Lorem ipsum", "text 3": "[{\"insert\":\"lorem ipsum!\\n\"}]" } { "title": "Lorem ipsum", "text 4": "[{\"insert\":\"\\n\",\"attributes\":{\"heading\":3}},{\"insert\":\"other text!\\n Some other text \\\"\"},{\"insert\":\"+\",\"attributes\":{\"b\":true}},{\"insert\":\"\\\" some text.\\n ... \\\"text\\\" some text.\\n\"}]", "image 13": "{\"imagePath\":\"section2image13\",\"ratio\":0.49907578558225507}", "text 8": "[{\"insert\":\"other text \\\"text\\\", another text line.\\n text\\n\"}]"

No estoy seguro de cómo proceder, en mi aplicación vue estoy leyendo el contenido de esta manera

 <div class="modal fade" id="feedContentModal" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true"> <div class="modal-dialog modal-xl"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="">{{ program.title }}</h5> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> </div> <div class="modal-body" v-for="( contents, index) in JSON.parse(program.body)" :key="index"> {{ contents }} </div> </div> </div> </div>

Como está guardado en formato json, estoy usando JSON.parse() para leerlo, pero esto solo resolverá en parte el problema. Estoy pensando en implementar un analizador de rebajas, pero no estoy seguro de si funcionará. ¿Alguien puede sugerirme una buena manera de resolver este problema?