view標簽

等效于html中的div

都是塊級元素，獨占一行，可設置寬高。

屬性類型默認值

hover-class	string	none

hover的中文意思是懸浮，但在微信小程序里面是按下去的意思。

當用戶按下按鈕的時候生效。

text標簽

等效于html中的span標簽

屬性類型默認值說明

user-select	boolean	false	文本是否可選，該屬性會使文本節點顯示為 inline-block
space	string	無	顯示連續空格
decode	boolean	false	是否解碼

user-select，就是是否允許用戶進行選擇，選擇后會出現對話框（復制，粘貼）。

備注：這個效果只有真機可以測試出來，在微信小程序代碼編輯器中無法顯示。

space就是是否解析連續的空格。

眾所周知，在html中文字中間有連續的空格的時候，html會解析成一個空格。詳細解析

所以，微信小程序，對它進行了補充，允許解析連續空格。

<text>文字 中間 有空格 </text><text space="nbsp">文字 中間 有空格 </text>

加了 space=“nbsp” 后連續空格就別解析出來了。

推薦space使用屬性nbsp，其余的不用去記，用不上。

decode屬性就是表示是否解碼

<text decode="true">中間&nbsp;空格&lt;; </text>

可以用來解碼

&nbsp; 和 &lt;等

navigator標簽

等效于html中的a標簽

navigator的中文含義是導航，字面意思，把你導向其他方向。

比如從主頁跳轉到logs頁面

<navigator url="/pages/logs/logs">點我跳轉到日志 </navigator>

這種默認打開后是二級頁面的形式，左上角有個返回按鈕。

如果不想二級頁面，想作為一個新的頁面，那么就在 open-type里面寫上redirect。

<navigator url="/pages/logs/logs" open-type="redirect">點我跳轉到日志 </navigator>

此時左上角就是一個小屋子圖標。

icon標簽

見名知意，用于顯示圖標。

屬性類型默認值必填說明

type	string		是	icon的類型，有效值：success, success_no_circle, info, warn, waiting, cancel, download, search, clear
size	number/string	23	否	icon的大小
color	string		否	icon的顏色，同css的color

<icon type="success" size="60" class="box"></icon>

type的有效值有：success, success_no_circle, info, warn, waiting, cancel, download, search, clear

scroll-view標簽

你可以把它理解成手機端的滾動條，可以橫著滾，也可以豎著滾。

屬性默認值必填說明

scroll-x	false	否	允許橫向滾動
scroll-y	false	否	允許縱向滾動

滾動條demo

<scroll-view scroll-x><view class="out"><icon type="success" size="60" class="box"></icon><icon type="success_no_circle" size="60" class="box"></icon><icon type="info" size="60" class="box"></icon><icon type="warn" size="60" class="box"></icon><icon type="waiting" size="60" class="box"></icon><icon type="cancel" size="60" class="box"></icon><icon type="download" size="60" class="box"></icon><icon type="search" size="60" class="box"></icon><icon type="clear" size="60" class="box"></icon></view> </scroll-view> .out{display: flex;flex-wrap: nowrap; }

總結

以上是生活随笔為你收集整理的微信小程序_组件学习_001的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。