会HTML语言的同学做(zuò)好以(yǐ)下三点就可(kě)熟(shú)练掌握微信小程序开发
发布时(shí)间:2017-01-25 09:37:27 | 发布者:泛亚电竞和海拔网(wǎng)络 | 浏览次(cì)数:34767 | 返回列表 | 返回首(shǒu)页
微信小程序现在(zài)很火,如果企业想要(yào)更大拓展空间那么这个领域值得涉足,合肥APP开(kāi)发公司(sī)认为如(rú)果掌握了一些开发(fā)语言(yán)设计(jì)小程序并不难。
在语言方(fāng)面,小(xiǎo)程序看(kàn)似重新(xīn)定义了一套标准。但实际上,它们与「前端三件套」——HTML、CSS 和 Java——差不太(tài)多。
下(xià)面,我们就来对(duì)比一下小程序开(kāi)发语言和「前端三件套(tào)」有什么(me)异同点:
HTML 与 WXML:两者差(chà)异比较(jiào)大,如果之前没有接(jiē)触过 androids 开发,可(kě)能会觉得有些头疼。事实上,WXML 更像是(shì) androids 开发(fā)中的界面 XML 描述(shù)文件,适合于(yú)程序(xù)界面的构建;而 HTML 则倾向于文(wén)章的(de)展示(这与 HTML 的历史有(yǒu)关),以及互(hù)联网页面的(de)构建。
WXSS 与 CSS:两者在语言(yán)上几乎没有差别,可以直接通用。
JS 文件:小程序的 JS 文件与前端开发使用(yòng)的(de) JS 几乎没有(yǒu)区别,只是小(xiǎo)程序(xù)的 JS 新(xīn)增(zēng)了微信的(de)一些 API 接口,并去除了一些不必要的功(gōng)能(如 DOM)。
在(zài)语言上,小程序(xù)完全向(xiàng)学习成(chéng)本最低的前端(duān)开发看齐,但(dàn)这不代(dài)表所有前端开发者(zhě)都能无缝迁(qiān)移。
如果(guǒ)你是从前端开发转向小(xiǎo)程序,就需要注意这两个(gè)点:
HTML 与 WXML 两种文件的构建思想差异较大,如果之前只接触过前端开(kāi)发,需要一点时间(jiān)才能适应 WXML 的(de)编写(xiě)方(fāng)法。
虽然小程序使用的是(shì)前端(duān)语言,但不(bú)代表可以继续沿用(yòng)前端的开发思想进行开发。小(xiǎo)程序对前端开发的要求(qiú)从「构建界面(miàn)」升级成(chéng)「开发完整应用」,前端开(kāi)发(fā)需要在(zài)意识(shí)上进行转(zhuǎn)变。
界面构建
1. 基本逻(luó)辑(jí)
WXML 和 WXSS 两种文件是(shì)小程序(xù)界面元素声明及样式描述文件。
WXML 最大的特点是(shì)以视图(view)的方式串联界面元素,并(bìng)通过程序逻辑(AppService),将(jiāng)信息更(gèng)新实时传递至视图层。
view 类似于 HTML 中(zhōng)的 div 元素。在构建的(de)时候,view 可以被(bèi)多级嵌套,view 内可以放置任意视觉元(yuán)素(sù)。
需要(yào)注意的是,元素一旦超出屏幕之(zhī)外,用户(hù)就无(wú)法(fǎ)看到了(le),这与 HTML 有较大不同。
比如,我们将手机屏幕想(xiǎng)像(xiàng)成一个舞台,舞台之(zhī)外(wài)的(de)演员是无法被观众看(kàn)到的。
小程序有专门用于滚(gǔn)动的视(shì)图。
如果希(xī)望界面是一个可以自由滚动的界面(例如列(liè)表等),可以使用 scroll-view 视图,在 WXSS 中将其大小调整为整(zhěng)个屏幕,并设置 scroll-y(上下滚(gǔn)动)或 scroll-x(左右滚动)为 true。
小程序中不能直接使用 DOM 控制 WXML 元素(sù)。如果(guǒ)需要进行(háng)数据更新,就(jiù)得使(shǐ)用 WXML 提供(gòng)的数据绑定及(jí)元素渲染方法。
还有(yǒu)一点需要注(zhù)意的是:小程(chéng)序(xù)的栅格排版系统使用的是 Flex 布局,它是(shì) W3C 在 2009 年提出的一(yī)种排(pái)版标(biāo)准。
2. 绑定(dìng)数据
对于(yú)单个字段,开发者可以使用数据绑定的方(fāng)法(fǎ)进行(háng)信息更新。
绑(bǎng)定的数据除了在(zài)加(jiā)载的时候可以更新(xīn),也(yě)可以在 JS 主程序中以(yǐ)函数形式进行(háng)更新(xīn),更(gèng)新同样可以(yǐ)反映到(dào)界面(miàn)上被绑定的数据中。
3. 条件(jiàn)渲染与列表(循环)渲(xuàn)染
条件渲染适(shì)用(yòng)于有(yǒu)意(yì)外情况提示(shì)的(de)页面(如无法加载列表(biǎo)或详情时,做出提示等等)。
它的渲染带有触发条件,即(jí)符合(hé)条件时(shí)渲染这(zhè)个页(yè)面,否(fǒu)则忽略或渲染另一段代码。
以上就是合肥(féi)网站建设的小(xiǎo)编分享的内容,希望能为您带来帮助(zhù)。更(gèng)多详(xiáng)情请关(guān)注:
http://www.zhuhai.huaibei.xinxiang.zz.pingliang.ww38.viennacitytours.com/