第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

有沒有辦法讓 vue 組件的模板只包含屬性的文本?

有沒有辦法讓 vue 組件的模板只包含屬性的文本?

慕絲7291255 2023-09-04 15:48:01
有沒有辦法讓 vue 組件的模板區(qū)域只包含純文本?當(dāng)前解決方案(使用 div 將其包裹在文本周圍)面臨的問題是,我遞歸地將這些組件與一行中的其他文本片段連接起來,這通常會導(dǎo)致跳轉(zhuǎn)到父容器的下一行,因為沒有當(dāng)前文本片段之前的文本片段右側(cè)留有足夠的空間。因此,文本段落應(yīng)如下所示:客戶很重要,有了客戶才會跟著客戶。全體員工應(yīng)該高興但又擔(dān)心。Curabitur 并不像 Nibh venenatis 那樣容易。廣告的整個生命或超常的醬汁。對醫(yī)療保健提供者的生活進行科學(xué)研究的作者。直到周末,沒有了夏天,沒有了生活的熱情。Mauris congue nibh 只需要哀悼的成員。結(jié)果如下所示:客戶很重要,有了客戶才會跟著客戶。全體員工應(yīng)該高興但又擔(dān)心。Curabitur 并不像 Nibh venenatis 那樣容易。廣告的整個生命或超常的醬汁。對醫(yī)療保健提供者的生活進行科學(xué)研究的作者。直到周末,沒有了夏天,沒有了生活的熱情。Mauris congue nibh 只需要哀悼的成員??紤]到上例中分別有5個文本片段。這就是使用模板標(biāo)簽內(nèi)的注釋來實現(xiàn)所述組件以具體化我的問題的方式:<template>  <div>{{element.text}}</div> <!--  This is how I can do it to this point-->  {{element.text}}            <!--  This is what I would like to do--></template><script>import { Component, Prop, Vue } from 'vue-property-decorator'import TextElement from '@/models/elements/Text'@Componentexport default class TextWrapper extends Vue {  @Prop() element!: TextElement}</script><style scoped></style>
查看完整描述

3 回答

?
幕布斯7119047

TA貢獻1794條經(jīng)驗 獲得超8個贊

簡單的答案是否定的,渲染函數(shù)/模板需要根元素。您可以使用<div>內(nèi)聯(lián)元素(例如 a)<span>或使用 css 屬性設(shè)置 div 的display: inline樣式來解決此問題,而不是使用 a。



查看完整回答
反對 回復(fù) 2023-09-04
?
白衣非少年

TA貢獻1155條經(jīng)驗 獲得超0個贊

我通過將 css 樣式屬性傳遞給父 vue 組件的模板,使用解決方法解決了我最初的意圖:


<template>

  <div>

    <span v-for="(line, index) in paragraph.lines" :key="index">

      <p v-if="line.length">

        <span v-for="(lineFragment, index) in line" :key="index">

          <component class="inline-component" :element="lineFragment" :is="lineFragment.type"/>

        </span>

      </p>

    </span>

  </div>

</template>


<script>

import { Component, Prop } from 'vue-property-decorator'

import ElementHook from '@/views/ElementHook.vue'


@Component

export default class ParagraphWrapper extends ElementHook {

  @Prop() element!: ParagraphElement


}

</script>


<style scoped>

  .inline-component {

    display: inline;

  }

</style>

ElementHook 組件作為一個基本的抽象類,它導(dǎo)入所有可以通過 `:is="lineFragment.type" 顯示的子組件(例如 TextWrapper 組件的“text”)。


如果想要確保段落仍然圍繞父容器對象的邊框,您需要考慮添加white-space: pre-wrap;到 SFC 底部定義的 css 類。


查看完整回答
反對 回復(fù) 2023-09-04
?
HUH函數(shù)

TA貢獻1836條經(jīng)驗 獲得超4個贊

Vue 組件模板應(yīng)該具有 DOM 中存在的根元素。通常使用div或包裝元素。span這很少是一個問題,因為可以設(shè)置根元素的樣式以適應(yīng)布局。

vue-fragment插件提供了React.FragmentVue 中的功能。它基本上是在安裝時解開根元素。由于它是一種黑客攻擊,因此它可能無法在所有情況下都按預(yù)期工作。

渲染函數(shù)可用于通過_v內(nèi)部方法渲染文本節(jié)點。它使用未記錄的 API 表明它也是一種黑客攻擊。


查看完整回答
反對 回復(fù) 2023-09-04
  • 3 回答
  • 0 關(guān)注
  • 172 瀏覽

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號