Удалить завершающий пробел из vue.js маршрутизатор-ссылка

#vue.js

#vue.js

Вопрос:

Текст в router-link всегда имеет завершающий пробел после. Из-за чего он не выравнивается по центру, как его удалить???

Тестовый код

 <div class="DesktopHeaderView">
        <router-link to="/">
            Test
        </router-link>
</div>
 

тест

Это мой настоящий код

 <div class="DesktopHeaderView">
        <router-link
            class="DesktopHeaderView__link"
            active-class="active"
            exact
            v-for="(view, index) in views"
            :key="index"
            :to="view.to"
        >
            {{ view.text }}
        </router-link>
</div>
 

конечные пробелы

Примечание: В текстовом поле нет конечных пробелов

Ответ №1:

Попробуйте с помощью javascript trim() view.text.trim()

Комментарии:

1. Это не работает. Я добавил пример кода, чтобы увидеть более четкую картину проблемы.

2. Вероятно, вам придется составить ul список со ссылками внутри. Я читал эту статью tutorialrepublic.com /… . Также вы можете попробовать установить отступы и поля для a элемента равными 0.

Ответ №2:

Мне каким-то образом удалось решить эту проблему, обернув текст тегом span

 <div class="DesktopHeaderView">
        <router-link
            class="DesktopHeaderView__link"
            active-class="active"
            exact
            v-for="(view, index) in views"
            :key="index"
            :to="view.to"
        >
            <span>{{ view.text }}</span>
        </router-link>
</div>
 

введите описание изображения здесь

Больше никаких конечных пробелов
Но до сих пор понятия не имею, почему он ведет себя так