微信小程序开发Wxml模板文件是什么

看到微信小程序开发Wxml模板文件,大家可能有点陌生,对他也没什么概念,下面就和大家介绍一下微信小程序开发Wxml模板文件是什么?

说到微信小程序开发Wxml模板文件,我们不得不说一下网页编程,网页编程一般用使用到Html+Css+Js等语言。Html是指该页面的结构,CSS是用来描述页面的样子。而JS是交互的,主要是处理页面和用户之间的交互。而在微信小程序中,微信小程序开发Wxml模板文件类似于Html的角色。打开 pages/index/index.wxml,你会看到以下的内容:

<view class=”container”>

  <view class=”userinfo”>

    <button wx:if=”{{!hasUserInfo && canIUse}}”>获取头像昵称</button>

    <block wx:else>

      <image src=”{{userInfo.avatarUrl}}” background-size=”cover”></image>

      <text class=”userinfo-nickname”>{{userInfo.nickName}}</text>

    </block>

  </view>

  <view class=”usermotto”><text class=”user-motto”>{{motto}}</text></view></view>

  微信小程序开发Wxml模板文件和html类似的地方在于标签和属性相似,但还有很多地方不同。

1. 标签名字不同

Html标签名字一般使用到的是div,p,spon.而小程序wxml模板文件标签名字用的是view,button,text等。

2. 开发效率

开发者在使用html的时候,可以根据这些标签组成不同的组件使用。需要自己组件开发,开发效率就低些。

wxml模板文件标签就是小程序给开发者包装好的基本能力,可以使用地图、视频等组件能力,大大提高了开发的效率。

3.多了一些 wx:if 这样的属性以及 {{ }} 这样的表达式

Wxml怎么写

<text>{{msg}}</text>

JS 只需要管理状态即可:

this.setData({ msg: “Hello World” })

以上和大家详细了一下微信小程序开发Wxml模板文件,主要和大家说了一些html和wxml模板文件有相似之处还有不同的地方,用对比的方式跟大家说明了小程序Wxml模板文件。希望以上的内容对大家有所帮助!想要了解更多的微信小程序开发可以看看微信小程序开发文档汇总


声明:本站部分文章来源于互联网,如有侵犯作者著作权,请及时与我们联系。

为您推荐