微信小程序开发问题

选择小程序开发公司，必须注意以下几点：

1、看其官网，如果一家小程序开发公司连自己的网站都没有，凭什么有实力帮客户开发小程序？一般这种公司都是皮包公司，赚差价的。

2、百度搜索该公司的品牌名，看是否有负面消息，如果百度搜索出现关键词比如：骗子、骗人等相关字眼或是直接在搜索结果出现负面消息，那么这家企业就要慎重选择了。

3、看其案例，如果一家小程序开发公司，连案例都没有，那么很有可能是刚成立不久的新公司

与iOS开发很相似，小程序的导航栏也可以全局设置一下，在公共文件appjson中设置了导航栏相关样式如下：

这个地方是全局设置，如果想要在不同的页面设置各自的标题属性，只需要在该子级文件中设置

子页面想调用共公js的方法，需先在子页面js中先实例化app:具体过程如下

在需要调用的子页面中，

如果是嵌套循环，很容易出现多个list和index，例如表视图一样，所以在小程序中可以重命名 list 和index 方法为：wx:for-index='重命名' wx:for-list="重命名"

在APP开发中，UI复用是一个很好的手段，在小程序上就是模板template。

在逛小程序联盟的时候发现了一个大湿总结的比我好，搬过来一下。

微信小程序中，如果几个页面中需要引用同一个header/footer，当定义了公共模板时，有两种引用方法如下：

方法一：在公共模板中定义template元素，利用 方法 ,这种方式只会显示公共模板的template里面的内容，之外的内容不会显示

方法二:

总结：import方式和imclude方式的不同在于前者仅引用公共模板中的template里面的内容后者仅引用template以外的内容，显而易见，include方式更简单一些，在wxml中只需要一句话即可。

rpx单位是微信小程序中css的尺寸单位，rpx可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。如在 iPhone6 上，屏幕宽度为375px，共有750个物理像素，则750rpx = 375px = 750物理像素，1rpx = 05px。

具体的 这里有一片文章介绍的很详细 ， 还有这个

小程序的事件主要有：

小程序中的wxml中绑定事件有两种：以touchtab为例 ，在wxml中必须有bind/catch不然无法实现上述事件

bindtouchtab和catchtouchtab bind的不会阻止事件冒泡（元素最里层到最外层函数执行），catch会阻止冒泡，只是冒泡到当前层结束

如果想在元素执行某事件时把元素的某个属性传到后台 可在元素中加入data-属性名称=“xxx”,在事件函数中 function(event){}的event中的currentTarget里面的data-set里面可查看接收在元素中绑定的的id或者其他属性clientX/Y 查看滑动手指距离屏幕左侧的位置，查看滑动位置也可以通过touchstart和和touchend的clientx/y获取

看到几个别人写的，瞬间石化，果断收藏。

在小程序中，定义了一项工具文件utils,此文件的js旨在本文件之内有效，当其他子页面想调用其中的js方法或者变量时，需要两步骤：

1：在utils被调用的js文件中，面向对象的方式模型输出： moduleexports={要调用的函数名称：要调用的函数名称 }；

2：在要调用的js文件中模块化引入utils的js文件 var object=require("utils被调用的js文件地址")； 可以输出一下object就能看到被调用的方法了；

例子如下：

要调用的js文件：

小程序的后台获取数据方式get/post具体函数格式如下：wxrequest({})

如果屏幕中某元素的内容超过此元素的高度，可设置元素为scroll-view 为滚动状态元素，这样可以做到元素固定高度且元素内容滚动屏幕不滚动的效果；

scroll-view标签的主要属性分为以下几种：

微信小程序广告轮播元素 所在元素/swiper-item>

其中属性有：

更改事件：bindchange='imgchange' imagechange()的edetailcurrent为当前显示页面的下标值

微信小程序的设计只需要以iPhone6屏幕尺寸750x1334px为视觉稿进行设计即可，因为微信小程序以rpx为css尺寸单位，rpx可以根据屏幕宽度进行自适应，规定屏幕宽度为750rpx，因此在iPhone6设计稿上1px=1rpx，在尺寸换算上就会很简单。

在这里插入描述

小程序的所有页面，包括小程序内嵌网页和插件，微信都会在其右上角放置官方小程序菜单，样式尺寸及布局如上图。开发者不可对其内容自定义，但可选择深浅两种基本配色以适应页面设计风格，如下图。

在这里插入描述

字体规范

在这里插入描述

小程序的字体依然遵循微信原生视觉规范：微信内字体的使用与所运行的系统字体保持一致，常用字号为20, 18, 17, 16,14 13, 11(pt)，使用场景具体如上图。

在这里插入描述

无彩色——主内容Black黑色，次要内容Grey灰色；时间戳与表单缺省值Light灰色；大段的说明内容而且属于主要内容用Semi黑；

在这里插入描述

有彩色——蓝色为链接用色，绿色为完成字样颜色，红色为出错用色，Press与Disable状态分别降低透明度为20%与10%；

顶部导航栏navigationBar

在这里插入描述

顶部导航栏一般简称导航栏，标准高度：128rpx，一般只做底色修改，标题区与导航区要进行自定义开发也是可以的，不过要注意设计的自有导航样式与微信官方小程序菜单样式要保持一定差异，以便区分。

标签分页导航tabBar

标签分页导航栏一般简称标签栏，标准高度：98rpx，可固定在页面的顶部或底部，便于用户在不同分页间做切换。标签数量在2-5个，为确保点击区域，建议标签数量不超过4项。一个页面也不应出现一组以上的标签栏，可根据产品需求选择或去掉标签栏。

1底部标签栏

在这里插入描述

顶部标签分页栏颜色可自定义。在自定义颜色选择中，务必注意保持分页栏标签的可用性、可视性和可 *** 作性。

d窗

在这里插入描述

无论是APP还是Web网页，d窗总是出现在页面的最上层，但是在小程序里导航栏跟标签栏的层级是最高的，以至于优先级较高的d窗在这里也要有所收敛，因此在设计和开发时，都需要注意避免踩坑。

启动页

在这里插入描述

小程序启动页是小程序在微信内一定程度上展现品牌特征的页面之一。本页面将突出展示小程序品牌特征和加载状态。启动页除品牌标志（ Logo ）展示外，页面上的其他所有元素如加载进度指示，均由微信统一提供且不能更改，无需开发者开发。

加载样式

无论是APP还是小程序，加载都不可避免，同样长时间的加载等待会引起用户的不良情绪，因此，在不可避免的加载和等待时，给予及时的反馈以舒缓用户等待的不良情绪都是必需的。小程序里除了自定义加载样式，更是依赖微信提供了一系列加载样式：

1页面下拉刷新加载

在这里插入描述

在微信小程序内，微信提供标准的页面下拉刷新加载能力和样式，开发者无需自行开发。

2页面内加载反馈

在这里插入描述

开发者可在小程序里自定义页面内容的加载样式。建议不管是使用在局部还是全局加载，自定义加载样式都应该尽可能简洁，并使用简单动画告知用户加载过程。

3模态加载

在这里插入描述

模态的加载样式将覆盖整个页面，由于无法明确告知具体加载的位置或内容可能引起用户的焦虑感，因此应谨慎使用。除了在某些全局性 *** 作下不要使用模态的加载。

4局部加载反馈

在这里插入描述

局部加载反馈是只在触发加载的页面局部进行反馈，这样的反馈机制更加有针对性，页面跳动小，是微信推荐的反馈方式。

5全局加载反馈

微信小程序最近火了，大家开发微信小程序有没有注意微信小程序对手机屏幕的要求或者影响呢，面对不同的手机屏幕，微信

rpx单位是微信小程序中css的尺寸单位，rpx可以根据屏幕宽度进行自适应,

微信小程序尺寸单位rpx以及样式

rpx单位是微信小程序中css的尺寸单位，rpx可以根据屏幕宽度进行自适应。

规定屏幕宽为750rpx。如在

iPhone6

上，屏幕宽度为375px，共有750个物理像素，则750rpx

=

375px

=

750物理像素，1rpx

=

0

rpx单位是微信小程序中css的尺寸单位，rpx可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。

如在

iPhone6

上，屏幕宽度为375px，共有750个物理像素，则750rpx

=

375px

=

750物理像素，1rpx

=

0。

rpx单位是微信小程序中css的尺寸单位，rpx可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。如在

iPhone6

上，屏幕宽度为375px，共有750个物理像素，则750rpx

=

375px

=

750物理像素，1rpx

=

05px

=

1物理像素。

设备 rpx换算px

(屏幕宽度/750) px换算rpx

(750/屏幕宽度)

iPhone5 1rpx

=

042px 1px

=

234px

iPhone6 1rpx

=

05px 1px

=

2rpx

iPhone6s 1rpx

=

0552px 1px

=

181rpx

微信小程序也支持rem尺寸单位，rem和rpx的换算关系：rem:

规定屏幕宽度为20rem；1rem

=

(750/20)rpx

注：开发微信小程序时设计师可以用

iPhone6

作为视觉稿的标准。

感谢大家阅读，希望能帮助到大家，谢谢大家对本站的支持！

将 appjson 中的 "style": "v2" 去除，小程序的新版基础组件强行加上了许多样式，难以覆盖，不关闭将造成部分组件样式混乱。

开发者工具创建的项目，miniprogramRoot 默认为 miniprogram，packagejson 在其外部，npm 构建无法正常工作。需要手动在 projectconfigjson 内添加如下配置，使开发者工具可以正确索引到 npm 依赖的位置。

打开微信开发者工具，点击  工具 -> 构建 npm ，并勾选  使用 npm 模块  选项，构建完成后，

到 全局配置 appjson 中注册引入组件，详见 快速上手 。

支持default、primary、info、warning、danger五种类型，默认为default。  格式：

通过plain属性将按钮设置为朴素按钮

设置hairline属性可以开启 05px 边框，基于伪类实现。

通过disabled属性来禁用按钮，此时按钮的bind:click事件不会触发。

通过loading属性来设置加载按钮   loading-type="spinner"   loading-text="加载中"

通过icon属性设置按钮图标，支持 Icon 组件里的所有图标，也可以传入图标 URL。

label     输入框左侧文本

type    可设置为任意原生类型, 如 number   idcard    textarea    digit

readonly  是否只读

custom-style    自定义样式

autosize    是否自适应内容高度，只对 textarea 有效，可传入对象,如 { maxHeight: 100, minHeight: 50 }，单位为px

show :是否显示 

onClose 点击其他位置，关闭d出层

position            可以设置为top、bottom、left、right。

Picker 选择器 需要配合d出层使用

<van-picker columns="{{ columns }}" bind:change="onChange" />

columns 对象数组，配置每一列显示的数据

onChange（e）    有默认参数 e 

value-key    选项对象中，文字对应的 key 通常用于对象数组

show-toolbar    是否显示顶部栏

defaultIndex     初始选中项的索引，默认为 0  不是双向绑定 需要自己改变defaultIndex  的值  需要渲染两次

windows微信小程序显示模糊的解决方法如下

设置变量值22css,设置的高,按照原宽高,获取该自制应的宽度应为多少,给变量值赋值33html中,动态设置宽度44定宽,自适应高应获取屏幕宽度,按照定高设置自适应宽,计算该自适应高度。

因为对小程序父标签和子标签的布局还不是特别了解，不像ios，父标签固定，子标签通过mansory去布局距离父的底部多少即可。小程序的我能想到的就是动态算出每一个标签的高度，然后总高度减掉就是想得到的子标签的高度了。如果有哪位大神可以指导一二，感激不尽~~~

<view id='viewID'>

<view id="scriptID">

        var query = wxcreateSelectorQuery();

        //选择id

        queryselect('#numID')boundingClientRect()

        queryselect('#scriptID')boundingClientRect()

        queryexec(function (res) {

          //res就是 所有标签为mjltest的元素的信息 的数组

          consolelog('所有：',res);

          //取高度

          thatsetData({

            storyHeight:thatdatadetailHeight -(res[0]height+res[1]height)

          })

        });

以上就是关于微信小程序开发问题全部的内容，包括:微信小程序开发问题、微信小程序开发常用知识点、小程序设计稿能用828吗等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！