js怎么把一个数组里面的值作为一个属性添加到另一数组包含的对象里(小程序)
上面这个需求我说的似乎不太明白,之前也是没有碰到过,也是最近在搞小程序,涉及到小程序前后台数据交互,展示的部分!!不太明白没关系等会我给大家举个例子,就明白了说起来有点拗口,一看就明白了,其实如果是原生js开发,并不要这么做,就因为小程序它把一些东西绑到了视图层上了,例如:for循环,当你拿到的数据格式不对时,所以就会在展示数据的时候你就需要做一点点处理,当然了如果你们后台能给到你正好需要的格式那你就轻松,万一不是你需要的正好的格式那就需要你自己去做些处理!!
例子:
例如下面这个界面:

其实在wxml视图层就一个for循环就搞定了!
wxml:
<view class="page-header">
<text class="page-header-text">{{title}}</text>
</view>
<scroll-view scroll-y="true">
<navigator class="navigator" url="../audio/audio?id={{item.muId}}" wx:for="{{imagescoverArr}}">
<view class="Name">
<view style="color:red; display:inline-block;">{{item.faName}}</view>
<view style="color: #F4F4F4; display:inline-block; margin-left:6rpx;">{{item.nickname}}</view>
</view>
<view>
<image class="image" src="{{item.imcsrc}}"></image>
</view>
<view class="muName">{{item.muName}}</view>
</navigator>
</scroll-view>
那么现在问题出现了:我从后台拿到的图片的路径是这样 "img/100230002/2017/3/13/9/201703130115070484063.jpg” ,看图:

问题出在那?(当时并没有imcsrc字段)
就是里面那个muCover没有办法直接用,而wxml里面for里面所展示的内容必须是for循环这一个数组里面的东西,不能掺杂别数组里面的东西;所以就要对这个字段处理一下!
如上图当时并没有imcsrc字段,imcsrc是我对muCover字段处理过后然后又给这个对象添加了imcsrc属性;处理方法如下:
//success是请求成功后的cb函数:
success: function(res) {
for(var i=0; i<res.data.content.length; i++){
arr.push("http://files.mchang.cn/"+res.data.content[i].muCover.replace(/.jpg/, '/100x100.jpg'))
res.data.content[i].imcsrc=arr[i];
}
console.log(res.data.content)
that.setData({
imagescoverArr: res.data.content
})
}
其实思路:先把数组对象里面这个属性给单独拿出来做一下字符串处理,处理成你想要的能直接用的格式,完了再把处理过后的东西作为一个属性返给这个对象,这样就可以直接用点语法直接用了!
附加提示:小程序设计图给的尺寸和rpx的转换:(rpx其实意思就是手机上的物理像素)苹果6手机屏幕宽是375px,750物理像素,顾750的量出来多少就是多少rpx;
如果是750的量出来多少px就是多少rpx
如果是640的,量出来的值需要乘以750/640得到rpx
看下图

js怎么把一个数组里面的值作为一个属性添加到另一数组包含的对象里(小程序)的更多相关文章
- PHP 使用用户自定义的比较函数对数组中的值进行排序
原文:PHP 使用用户自定义的比较函数对数组中的值进行排序 usort (PHP 4, PHP 5) usort — 使用用户自定义的比较函数对数组中的值进行排序 说明 bool ...
- PHP usort 使用用户自定义的比较函数对数组中的值进行排序
From: http://www.php100.com/cover/php/2395.html usort (PHP 4, PHP 5) usort — 使用用户自定义的比较函数对数组中的值进行排序 ...
- PHP二维数组按照键值排序
在开发过程中,我们常常需要对二维数组按照数组的某个键来排序,这里提供两个封装好的方法,可以放到公共函数模块里以后需要的时候直接调用即可. /** * 二维数组按照键值降序排序 * @param arr ...
- Shell系列(38)- 数组操作→取值、遍历、替换、删除
引言 在Linux平台上工作,我们经常需要使用shell来编写一些有用.有意义的脚本程序.有时,会经常使用shell数组.那么,shell中的数组是怎么表现的呢,又是怎么定义的呢?接下来逐一的进行讲解 ...
- 两天快速开发一个自己的微信小程序
p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px "Songti SC" } p.p2 { margin: 0.0px 0. ...
- 快速开发一个自己的微信小程序
一.写在前面 1.为什么要学小程序开发? 对于前端开发而言,微信小程序因为其简单快速.开发成本低.用户流量巨大等特点,也就成了前端开发工程师必会的一个技能. 2.先看看小程序效果 (1)欢迎页 (2) ...
- 微信小程序 WXML、WXSS 和JS介绍及详解
前几天折腾了下.然后列出一些实验结果,供大家参考. 百牛信息技术bainiu.ltd整理发布于博客园 0. 使用开发工具模拟的和真机差异还是比较大的.也建议大家还是真机调试比较靠谱. 1. WXML( ...
- 移动端 | Vue.js对比微信小程序基础语法
(1)vue 自定义组件与父组件的通信,props:[abb],可以看成自组建的一个自定义属性 (2)vue 模版语法{{}} 只能是在DOM中插入,<div>{{acc}}</di ...
- 微信小程序开发入门:10分钟从0开始写一个hello-world
小程序开发需要三个描述整体程序的app文件 和 一个描述多个页面的 pages文件夹. (1)三个app文件分别是app.js,app.json,app.wxss. app.js文件是脚本文件处理一些 ...
随机推荐
- 纯手写SpringMVC到SpringBoot框架项目实战
引言 Spring Boot其设计目的是用来简化新Spring应用的初始搭建以及开发过程.该框架使用了特定的方式来进行配置,从而使开发人员不再需要定义样板化的配置. 通过这种方式,springboot ...
- python简说(十九)操作redis
一.关系型数据库 mysql.oracle.sql server sql语句来操作数据,数据是存在磁盘上的 非关系型数据库.NOSQL,redis,memcache key = vaule 1.数据是 ...
- python简说(十六)第三方模块安装
安装第三模块 1.pip install xxx pip问题 1.提示没有pip命令的, 把python的安装目录. 安装目录下面的scripts目录加入到环境变量里面 2.Unknown or un ...
- ubuntu18.04 安装新版本openssl
首先我们应该知道ubuntu18.04内置了1.1.0g版本的openssl: 使用下面的apt命令更新Ubuntu存储库并安装软件包编译的软件包依赖项: sudo apt update sudo a ...
- 【python003-变量】
变量 一.在使用变量之前,需要先对其进行赋值 二.变量命名的规则:可以包含字母,数字,下划线,但是不能以数字开头 三.字符串: 1.引号内的一切东西 2.python的字符串是要在两边加上引号,对于单 ...
- C# 尝试读取或写入受保护的内存。这通常指示其他内存已损坏
用管理员身份运行CMD,输入netsh winsock reset并回车(注意,必须是已管理员身份运行,这个重置LSP连接)运行后提示要重启生效,结果没重启就OK了(重启不重启看最终效果).
- Python3 tkinter基础 Entry state 不可写 可以选 可复制的输入框
Python : 3.7.0 OS : Ubuntu 18.04.1 LTS IDE : PyCharm 2018.2.4 Conda ...
- tp剩余未验证内容-4
关于pop-up被blocked的问题 首先 这个pop-up的功能叫 popup blocker , 它是浏览器(包括ff, chrome等) 自身 所内置 的一个功能, 不是 安装的外部 插件/或 ...
- HihoCoder 1634 Puzzle Game(最大子矩阵和)题解
题意:给一个n*m的矩阵,你只能选择一个格子把这个格子的数换成p(也可以一个都不换),问最大子矩阵和最小可能是多少? 思路: 思路就是上面这个思路,这里简单讲一下怎么n^3求最大子矩阵和:枚举两行(或 ...
- 【做题】TCSRM591 Div1 500 PyramidSequences——数形结合&思维
题意:定义高度为\(x\)的金字塔数列为周期为\(2x-2\)的无限数列.它的每一个周期都是形如\(1,2,...,x-1,x,x-1,...,2\)的形式.记高度为\(x\)的金字塔数列第\(i\) ...