[{"data":1,"prerenderedAt":207},["ShallowReactive",2],{"docs:\u002Fdocs\u002Fguides\u002Fstorage":3},{"id":4,"title":5,"body":6,"description":197,"extension":198,"meta":199,"navigation":202,"path":203,"seo":204,"stem":205,"__hash__":206},"docs\u002Fdocs\u002Fguides\u002Fstorage.md","Сохранение и загрузка",{"type":7,"value":8,"toc":192},"minimark",[9,14,18,158,161,165,168,171,175,188],[10,11,13],"h2",{"id":12},"выберите-формат","Выберите формат",[15,16,17],"p",{},"HTML удобен для публикации. JSON сохраняет поддерживаемую структуру редактора. CSS храните рядом отдельным полем. getJSON возвращает независимый снимок: изменение объекта не меняет документ.",[19,20,25],"pre",{"className":21,"code":22,"language":23,"meta":24,"style":24},"language-ts shiki shiki-themes github-dark","const unsubscribe = editor.on('change', event => {\n  const snapshot = { json: event.json, css: event.css, revision: event.revision };\n  \u002F\u002F Передайте snapshot в слой сохранения вашего приложения.\n  console.log(snapshot);\n});\nconst snapshot = { json: editor.getJSON(), css: editor.getCSS() };\nawait editor.setContent(snapshot.json, { css: snapshot.css });\nunsubscribe();\n","ts","",[26,27,28,72,86,93,105,111,135,149],"code",{"__ignoreMap":24},[29,30,33,37,41,44,48,52,55,59,62,66,69],"span",{"class":31,"line":32},"line",1,[29,34,36],{"class":35},"snl16","const",[29,38,40],{"class":39},"sDLfK"," unsubscribe",[29,42,43],{"class":35}," =",[29,45,47],{"class":46},"s95oV"," editor.",[29,49,51],{"class":50},"svObZ","on",[29,53,54],{"class":46},"(",[29,56,58],{"class":57},"sU2Wk","'change'",[29,60,61],{"class":46},", ",[29,63,65],{"class":64},"s9osk","event",[29,67,68],{"class":35}," =>",[29,70,71],{"class":46}," {\n",[29,73,75,78,81,83],{"class":31,"line":74},2,[29,76,77],{"class":35},"  const",[29,79,80],{"class":39}," snapshot",[29,82,43],{"class":35},[29,84,85],{"class":46}," { json: event.json, css: event.css, revision: event.revision };\n",[29,87,89],{"class":31,"line":88},3,[29,90,92],{"class":91},"sAwPA","  \u002F\u002F Передайте snapshot в слой сохранения вашего приложения.\n",[29,94,96,99,102],{"class":31,"line":95},4,[29,97,98],{"class":46},"  console.",[29,100,101],{"class":50},"log",[29,103,104],{"class":46},"(snapshot);\n",[29,106,108],{"class":31,"line":107},5,[29,109,110],{"class":46},"});\n",[29,112,114,116,118,120,123,126,129,132],{"class":31,"line":113},6,[29,115,36],{"class":35},[29,117,80],{"class":39},[29,119,43],{"class":35},[29,121,122],{"class":46}," { json: editor.",[29,124,125],{"class":50},"getJSON",[29,127,128],{"class":46},"(), css: editor.",[29,130,131],{"class":50},"getCSS",[29,133,134],{"class":46},"() };\n",[29,136,138,141,143,146],{"class":31,"line":137},7,[29,139,140],{"class":35},"await",[29,142,47],{"class":46},[29,144,145],{"class":50},"setContent",[29,147,148],{"class":46},"(snapshot.json, { css: snapshot.css });\n",[29,150,152,155],{"class":31,"line":151},8,[29,153,154],{"class":50},"unsubscribe",[29,156,157],{"class":46},"();\n",[15,159,160],{},"В callback не вызывайте setContent с тем же документом без необходимости: это может породить цикл обновлений. Ошибку записи, очередь запросов, debounce, повтор и состояние «сохранено» организует приложение.",[10,162,164],{"id":163},"ревизия-и-конфликты","Ревизия и конфликты",[15,166,167],{},"revision — текущая ревизия локального документа, а не серверная версия или уникальный глобальный id. Замена фрагмента и поздний ответ загрузки проверяют её. Для серверных конфликтов используйте отдельную версию записи приложения.",[15,169,170],{},"Для хранения JSON предусмотреть свою версию формата и проверку восстановления после обновления библиотеки. Импорт ошибочного\u002Fнебезопасного содержимого не должен заменять рабочую копию без подтверждения.",[10,172,174],{"id":173},"исходник","Исходник",[15,176,177,178,61,183,187],{},"Change приходит после корректного применения. Во время ошибки getHTML\u002FgetJSON\u002FgetCSS возвращают последнюю применённую версию, не текст ошибочного черновика. ",[179,180,182],"a",{"href":181},"\u002Fdocs\u002Freference\u002Fevents","События",[179,184,186],{"href":185},"\u002Fexamples\u002Fstorage","пример сохранения",".",[189,190,191],"style",{},"html pre.shiki code .snl16, html code.shiki .snl16{--shiki-default:#F97583}html pre.shiki code .sDLfK, html code.shiki .sDLfK{--shiki-default:#79B8FF}html pre.shiki code .s95oV, html code.shiki .s95oV{--shiki-default:#E1E4E8}html pre.shiki code .svObZ, html code.shiki .svObZ{--shiki-default:#B392F0}html pre.shiki code .sU2Wk, html code.shiki .sU2Wk{--shiki-default:#9ECBFF}html pre.shiki code .s9osk, html code.shiki .s9osk{--shiki-default:#FFAB70}html pre.shiki code .sAwPA, html code.shiki .sAwPA{--shiki-default:#6A737D}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}",{"title":24,"searchDepth":74,"depth":74,"links":193},[194,195,196],{"id":12,"depth":74,"text":13},{"id":163,"depth":74,"text":164},{"id":173,"depth":74,"text":174},"Согласованные HTML\u002FJSON и CSS, события и ответственность приложения.","md",{"group":200,"order":201},"Работа с документом",22,true,"\u002Fdocs\u002Fguides\u002Fstorage",{"title":5,"description":197},"docs\u002Fguides\u002Fstorage","WiDNXfkeIVLq6P-8M7pv-lq-z0vVi37ag4nxENM1mGU",1792670389277]