微信小程序(非技术文,小分享而已)

467 阅读6分钟

1.小程序快速创建页面文件的方法?

在app.json里的pages数组里添加一个页面的路径,如果这个路径指向的是一个不存在的文件,那么MINA框架会自动创建这个页面 的四个页面。用这种方法创建文件的好处就是不仅快捷,而且页面文件会自动添加一些默认代码,防止小程序以下两个Q&A错误。

2.wxss编译错误怎么解决 这个怎么解决,话说没想出来为什么编译错误

解决办法:在控制台输入openVendor(),清除里面的wcsc、wcsc.exe 然后重启工具

3.小程序的域名的要求

  • 小程序域名必须以https开头
  • 而且需要在开发设置中进行配置

4.小程序关联公众号,小程序之间跳转有什么要求

  • 小程序关联公众号要在公众号中进行关联,需要小程序管理员通过
  • 小程序之间相互跳转,必须绑定在同一个公众号下

5.如何获取 openId, sessionKey, unionId

在app.js 中 wx.login中 发送 res.code 到后台换取openId, sessionKey,unionId

6.小程序的发布流程

  1. 独立模式:开发工具上传,然后到微信公众平台登录小程序账号,在版本管理中提交审核
  2. 模板模式:
  • 开发工具上传,然后到微信开放平台登录公众号账号。
  • 第三方平台→对应公众号点详情→开发配置→把对应版本添加到模板库
  • 把版本号及生成的模板Id给测试或者后台。

7.小程序页面间有哪些传递数据的方法?

  • 在app.js定义全局变量,并在每个页面中引入
  • 使用本地缓存 setStorageSync getStorageSync
  • 使用路由跳转在url后面传入参数 在子页面用onLoad函数用用options参数接受
  • 组件之间传递 父传子 在子组件中用 properties 中接受 子传父 给组件设置myevent事件 通过this.triggerEvent('myevent', myEventDetail) 传递

8.页面与组件之间如何通信?

  1. 通信传递
  • 父传子 在子组件中用 properties 中接受
  • 子传父 给组件设置myevent事件 通过this.triggerEvent('myevent', myEventDetail) 传递
  • 使用本地缓存 setStorageSync getStorageSync
  1. 组件创建及引用
  • 与pages同级创建一个components组件
  • 在页面的json文件中引用组件
    {
    "usingComponents": {
        "组件名称":"组件路径"
      }}
    }
  • 在wxml文件引用 例:<songList id='songList'></songlist>

9.路由跳转方式

  • 平级跳转: wx.redirectTo,没有返回键
  • 上级跳转: wx.navigateTo,有返回键
  • 跳转到带有tabBar的页面:wx.switchTab
  • 跳转到任意页面:wx.reLaunch,没有返回键
  • 要注意的是 navigateTo, redirectTo 只能打开非 tabBar 页面

10.小程序的生命周期函数?

应用生命周期函数:onLaunch 监听小程序初始化、onShow 显示、onHide 隐藏 、onError 错误监听函数、onPageNotFound 页面不存在监听函数

页面生命周期函数:onLoad 页面加载、onShow 显示 、 onReady 页面初次渲染完成、onHide 隐藏 、 onUnload 页面卸载

组件的生命周期函数:created 组件刚创建时、attached 组件进入页面节点树时、ready 组件在视图布局完时、moved 组件被移动到节点树另一个位置时执行、detached 组件从页面移除时、error 组件方法抛出错误时

11.小程序中target和currentTarget有什么区别?

target指的是当前点击的组件 和currentTarget 指的是事件捕获的组件

12.bindtap和catchtap的区别

  • bindtap 元素绑定事件,父节点绑定事件会冒泡,即事件绑定不会阻止冒泡事件向上冒泡。
  • catchtap 不会冒泡,仅在当前元素触发,即事件绑定可以阻止冒泡事件向上冒泡

13.如何实现下拉刷新

  • json中配置:"enablePullDownRefresh": true
  • 调用onPullDownRefresh 函数

14.小程序下载资源到本地,如何持久保存文件

下载文件资源到本地,客户端直接发起一个 HTTP GET 请求,返回文件的本地临时路径,文件的临时路径,在小程序本次启动期间可以正常使用, 如需持久保存,需在主动调用 wx.saveFile,才能在小程序下次启动时访问得到。

15.页面底部的tabBar是由什么决定的,如何改变tabBar 的位置

  • 页面底部的 tabBar 由页面决定,即只要是定义为 tabBar 的页面,底部都有 tabBar;
  • app.json中配置底部栏,也可配置顶部,修改位置即可。
  • tabBar最少两个最多五个。

16.小程序里的渲染

{{}},插值表达式

17.模板的定义和使用

  • 使用 name 属性,作为模板的名字
  • 使用 is 属性,声明需要的使用的模板,然后将模板所需要的 data 传入

18.简单说几个小程序的指令

wx:for、wx:for-item、wx:show、wx:hide、wx:if、wx:elseif、wx:else

19.如何动态绑定类、样式等

三元表达式

class="{{orderMeetingArray.length ?'showformbtn':'hideformbtn'}}"

20.简单说几个小程序的事件

bindtap、catchtap、longpress、touch(start、move、cancel、end)、transitionend等

21.怎么解决下拉刷新不能和scroll-view一起使用的问题

将scroll-view组件换为view组件,事件换成onReachBottom

22.小程序中的长度单位

rpx,一般设计稿为375/750

23.关于this.data和this.setData

一般setData方法多用于点击后改变页面信息或者刷新后与后台交互获取最新的信息

  • 直接修改 this.data 而不调用 this.setData 是无法改变页面的状态的,还会造成数据不一致
  • 单次设置的数据不能超过1024kB,请尽量避免一次设置过多的数据。

24.小程序关联微信公众号如何确定用户的唯一性?

使用wx.getUserInfo方法withCredentials为 true 时 可获取encryptedData,里面有union_id。后端需要进行对称解密

25.小程序的双向绑定和vue哪里不一样?

小程序直接this.data的属性是不可以同步到视图的,必须使用this.setData({}),例下:

    this.setData({
      noBind:true
    })

26.小程序熄屏之后阻止刷新操作?

小程序熄屏之后会触发onHide()函数,在此函数进行一些操作。

27.模态框有没有用过,有没有踩过什么坑

开放性答案。(例:wx.showToast中icon不为none时title 文本最多显示 7 个汉字长度)

28.介绍几种跨端开发(小程序、H5)的框架及其优劣

wepy mpvue taro uni-app
语法风格 类vue vue react,支持JSX vue
多端复用 微信、支付宝、百度 微信、支付宝、百度、字节跳动 H5、微信、支付宝、百度、字节跳动、qq小程序、快应用、ReactNative H5、微信、支付宝、百度、字节跳动、qq小程序、安卓、ios
上手成本 熟悉vue且学习wepy 熟悉vue即可 熟悉react即可 熟悉vue且学习uni-app
组件化 自定义组件化 vue组件规范 react组件规范 小程序组件规范
脚手架 wepy-cli vue-cli taro-cli vue-cli
构建工具 框架内置构建工具 webpack webpack webpack
样式规范 Less/Sass/Stylus/PostCss Less/Sass/Stylus/PostCss Less/Sass/Stylus/PostCss Less/Sass/Stylus/PostCss

补充:下图转自