Динамически добавлять json контент с vue -if и другими vue атрибутами - PullRequest
0 голосов
/ 03 мая 2020

Я работаю chrome расширение, которое использует vue. Я обнаружил, что Google может занять некоторое время для публикации sh обновлений, поэтому есть некоторый контент, который я бы хотел редактировать с помощью json, который вызывается расширением через $ .get JSON https запрос. До сих пор это работало довольно хорошо для получения необработанного текста. Но у меня возникают проблемы, когда я пытаюсь добавить тег span с помощью оператора v-if, например:

Thank you for meeting. We have prepared the following <span v-if='docCount.length > 0'>documents</span><span v-else>document</span> for you today:

В результате получается, что он просто говорит «подготовил следующие« documentsdDocuments », как если бы он принимает все, чтобы быть правдой.

Я получил этот результат после помещения вышеуказанного JSON текста в v- html следующим образом:

<p v-html="coverLetterContent['p1']"></p>

Я получил тот же результат после попытки выполнить следующее:

.bind(this)).then( function (result){
      $(".letter-body").append("<p>"+result["letter"]["p1"]+"</p>")
    });

Я также попытался создать динамический компонент c следующим образом, но получал ошибку, и ничего не отображалось:

dynamicComponent: function() {
      return {
        template: `<p>${coverLetterContent["p1"]}</p>`,
        methods: {
          someAction() {
            console.log("Action!");
          }
        }
      }
    }

Ошибка, с которой я столкнулся это было: «ReferenceError: coverLetterContent не определен». coverLetterContent определен в данных приложения vue и доступен через вызов v- html, описанный выше.

...