學做小程序第二講view、text、image組件

這一節(jié)開始我們來編寫小程序的代碼，在實現(xiàn)布局和樣式之前，我們先給頁面添加頁面結構和內(nèi)容。我們看一下效果圖，在這個頁面上我們希望呈現(xiàn)的是一張圖片和三段文本，那么類似于html中是通過對應的標記元素來表達這樣的圖片和文本，在wc mail中也是通過框架提供的一些基礎的組件，來表達對應的這樣的一些內(nèi)容元素。

那么什么叫基礎組建？那么在這里面我們前面 hello world，我們就是通過包裝在一個text組件來表示，那么這個text組件和我們小程序html中的一個 span標記元素是非常類似的。它的形式也是可以分為元素的開始標記，元素內(nèi)容以及元素的結束標記，那么在開始標記中間，我們也可以包含一些元素對應的屬性。

那么在小程序wxml中有一些屬性是任何一個組件都可以設置的，比如說這里的 class屬性，ID屬性，還有這里的我們之前用到的style屬性，以及我們可以在wxml中通過單個tab這樣的方式來給組件元素特定我們也可以通過設置批準屬性來控制這個元素是否隱藏，那么在這里把它設為處，那么這個元素就隱藏起來了。我們還可以設置一些組件，自定義的數(shù)據(jù)通過對杠這種形式的屬性來進行設置，很重要。那么通過對這種方式定義的自定義數(shù)據(jù)，將會在事件觸發(fā)的時候封裝在事件對象中傳遞給對應的事件處理函數(shù)進行處理。

好，這是我們提到的關于wx M組建的一個基本構成，以及它的一些常見的可以設置的屬性。那么在后面的講解中，我們會將組建和元素這兩個詞等同。我們來看一下，另外效果圖，那么上面會有三個對應的文本需要顯示，那么在這里面在內(nèi)容結構上，我們就需要使用三個對應的text組件元素來表示這三大文本。

好，我們直接設置一下，那么除了 text元素來表示這樣的文本之外，我們還要展示一張圖片，那么同樣的類似于html中通過頁面元素來表示圖片，在這里我們也是通過一米級元素來表示這樣的一張圖片。那么在這里我們要注意所有的wx面組件元素，他們都是既有開始標記又有結束標記，它沒有一個單標記元素的這么一個概念。那么在這里面我們是通過src屬性來指定圖片的地址。