网络澳门娱乐网址_首页(欢迎您!)

<p id="5lllm"><strong id="5lllm"><small id="5lllm"></small></strong></p>
      1. 导航

        小程序开发中WXSS 样式和JS 逻辑交互应用

        发布时间:2020-01-11 20:18:06 来源:「九州科技」值得信赖的互联网服务商

        WXSS 样式

        WXSS 具有 CSS 大部分的特性,小程序在 WXSS 也做了一些扩充和修改。

        1. 新增了尺寸单位。在写 CSS 样式时,开发者需要考虑到手机设备的屏幕会有不同的宽度和设备像素比,采用一些技巧来换算一些像素单位。WXSS 在底层支持新的尺寸单位 rpx ,开发者可以免去换算的烦恼,只要交给小程序底层来换算即可,由于换算采用的浮点数运算,所以运算结果会和预期结果有一点点偏差。

        2. 提供了全局的样式和局部样式。和前边 app.jsonpage.json 的概念相同,你可以写一个 app.wxss 作为全局样式,会作用于当前小程序的所有页面,局部页面样式 page.wxss 仅对当前页面生效。

        3. 此外 WXSS 仅支持部分 CSS 选择器

        更详细的文档可以参考 WXSS 。

        JS 逻辑交互

        一个服务仅仅只有界面展示是不够的,还需要和用户做交互:响应用户的点击、获取用户的位置等等。在小程序里边,我们就通过编写 JS 脚本文件来处理用户的操作。

        <view>{{ msg }}</view>
        <button bindtap="clickMe">点击我</button>
        

        点击 button 按钮的时候,我们希望把界面上 msg 显示成 "Hello World",于是我们在 button 上声明一个属性: bindtap ,在 JS 文件里边声明了 clickMe 方法来响应这次点击操作:

        Page({
          clickMe() {
            this.setData({msg: 'Hello World'})
          }
        })
        

        响应用户的操作就是这么简单,更详细的事件可以参考文档 WXML - 事件 。

        此外你还可以在 JS 中调用小程序提供的丰富的 API,利用这些 API 可以很方便的调起微信提供的能力,例如获取用户信息、本地存储、微信支付等。在前边的 QuickStart 例子中,在 pages/index/index.js 就调用了 wx.getUserInfo 获取微信用户的头像和昵称,最后通过 setData 把获取到的信息显示到界面上。更多 API 可以参考文档 小程序的API 。

        最新资讯
        相关推荐
        服务项目
        微信客服
        180-7107-7883
        地址:湖北省武汉市解放大道航天双城6栋25层
        E-mail:125435440@QQ.com
        备案号:鄂ICP备13002765号-6    鄂公网安备 42010202000700号    网站地图
        九州科技,您身边的互联网应用方案提供商-高端网站建设-网站制作-网站开发-网页设计-微信开发-小程序开发
        高端网站建设 公众号开发 小程序制作 网站seo优化 H5活动营销 互联网产品

        18071077883

        提交需求
        网络澳门娱乐网址