快應用 通用屬性

2020-08-06 11:46 更新

通用屬性,即所有組件都支持的屬性。

開發(fā)者可以在所有的組件標簽上都使用通用屬性

示例代碼

<template>
  <div>
      <text id="text1" class="text-normal">line 1</text>
      <text id="text2" class="text-normal red">line 2</text>
  </div>
</template>

常規(guī)屬性

名稱 類型 默認值 描述
id <string> - 唯一標識
style <string> - 樣式聲明
class <string> - 引用樣式表
disabled <boolean> false 表明當前組件是否可用
aria-label <string> - 當前元素的標簽描述,接受字符串作為參數(shù)
aria-unfocusable <boolean> false 無障礙模式下是否能夠獲取焦點, 設置 true 時, 該組件 aria-label 屬性在無障礙模式下不會生效
forcedark 1070+ <boolean> true 組件級別的夜間模式自動反色開關(僅 Android 10+系統(tǒng)支持),非必填,默認值為 true(開啟自動反色)

forcedark 參數(shù)注意事項:

1.常規(guī)屬性的forcedark參數(shù)為全小寫,與manifest.json的forceDark參數(shù)為駝峰命名法不一樣。

2.video、camera、map、custommarker組件均不支持設置forcedark參數(shù),也不會響應父元素的forcedark設置

3.span 組件不支持forcedark開關,它只能依賴父元素的forcedark參數(shù)值控制開關,并且當父元素為 span 的時候,繼續(xù)往上找,直至找到父元素為a或text元素截止

渲染屬性

名稱 類型 默認值 描述
for <array> - 根據數(shù)據列表,循環(huán)展開當前標簽
if <boolean> - 根據數(shù)據 boolean 值,添加或移除當前標簽
show <boolean> - 根據數(shù)據 boolean 值,顯示或隱藏當前標簽,相當于控制{ display: flex | none }

渲染屬性工作方式詳見 template 模板

注意:屬性和樣式不能混用,不能在屬性字段中進行樣式設置

data 屬性

給組件綁定 data 屬性,然后運行時通過 dataset 獲取,方便進一步判斷

示例:

<template>
  <div>
    <div id="elNode1" data-person-name="Jack"></div>
  </div>
</template>

<script>
  export default {
    onReady () {
      const el = this.$element('elNode1')
      const elData = el.dataset.personName
      console.info(`輸出data屬性: ${elData}`)
    }
  }
</script>


以上內容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號