- 写了一个input组件的测试代码,有些地方不是很懂,求指教?
[代码]Page({[代码][代码] [代码][代码]changeValue : [代码][代码]function[代码][代码](e){[代码][代码] [代码][代码]console.log(e.detail);[代码][代码] [代码][代码]var[代码] [代码]value = e.detail.value,pos = e.detail.cursor,left;[代码][代码] [代码][代码]//计算光标位置[代码][代码] [代码][代码]if[代码] [代码](pos != -1) {[代码][代码] [代码][代码]//光标在中间位置[代码][代码] [代码][代码]left = value.slice(0,pos);[代码][代码] [代码][代码]//修改后光标位置要随之变化[代码][代码] [代码][代码]pos = left.replace(/123/g,[代码][代码]'2'[代码][代码]).length;[代码][代码] [代码][代码]}[代码][代码] [代码][代码]return[代码] [代码]{[代码][代码] [代码][代码]value : e.detail.value.replace(/123/g,[代码][代码]'2'[代码][代码]),[代码][代码] [代码][代码]cursor : pos[代码][代码] [代码][代码]}[代码][代码] [代码][代码] [代码][代码] [代码][代码]},[代码][代码] [代码] [代码]});[代码][代码]<[代码][代码]view[代码] [代码]class[代码][代码]=[代码][代码]"section"[代码][代码]>[代码][代码] [代码][代码]<[代码][代码]input[代码] [代码]placeholder[代码][代码]=[代码][代码]"内容中123会被替换成0"[代码] [代码]bindinput[代码][代码]=[代码][代码]"changeValue"[代码][代码] [代码][代码]type[代码][代码]=[代码][代码]"number"[代码] [代码]maxlength[代码][代码]=[代码][代码]"20"[代码][代码]/>[代码][代码]</[代码][代码]view[代码][代码]>[代码]问题1:这段代码作用主要是将输入内容‘123’用‘2’代替,changeValue事件函数里面调用了一个return方法,我想知道return返回的时候是不是有触发渲染的作用,因为我把return注掉,输入123就不再被替换。 问题2:changeValue事件函数里面第一句是打印e.detail,我打印出来是“{value: "1234567", cursor: 7}”这种,打印内容在后面return处有所照应,我想知道的是通常打印e.detail到底是打印出来什么内容呢,因为这段代码‘console.log(e.detail);’是第一句,我并不知道会打印什么东西。
2019-11-06 - 我用滑块视图组件写了一个自定义轮播图,有几行代码不是很理解,求分析?
问题点1:js文件中,for循环控制条件是“item = sliederList[i];”,按说这里应该是和i有关的,比如“i<5”,这样写for循环什么时候结束呢 问题2:js文件中,sliderList一共三个item,切换时三个selected的切换状态应该是“true false false”,"false,true false","false false true",但是“item.selected = e.detail.current == i;”怎么改变selected的看不懂 [代码]Page({[代码] [代码] [代码][代码]data: {[代码][代码] [代码][代码]sliderList : [[代码][代码] [代码][代码]{selected:[代码][代码]true[代码][代码], imageSource:[代码][代码]'./image/banner1.jpg'[代码][代码]},[代码][代码] [代码][代码]{selected:[代码][代码]false[代码][代码], imageSource:[代码][代码]'./image/banner2.jpg'[代码][代码]},[代码][代码] [代码][代码]{selected:[代码][代码]false[代码][代码], imageSource:[代码][代码]'./image/banner3.jpg'[代码][代码]}[代码][代码] [代码][代码]][代码][代码] [代码][代码]},[代码][代码] [代码] //修改指示点选中态[代码] [代码][代码]switchTab : [代码][代码]function[代码][代码](e) {[代码][代码] [代码][代码]var[代码] [代码]sliederList = [代码][代码]this[代码][代码].data.sliderList,i, item;[代码][代码] [代码][代码]for[代码][代码](i = 0;item = sliederList[i];++i){[代码][代码] [代码][代码]item.selected = e.detail.current == i;[代码][代码] [代码][代码]} [代码][代码] [代码][代码]this[代码][代码].setData({[代码][代码] [代码][代码]sliderList:sliederList[代码][代码] [代码][代码]});[代码][代码] [代码][代码]}[代码][代码]});[代码] [代码] [代码] [代码] [代码] [代码] [代码] [代码]<[代码][代码]view[代码] [代码]class[代码][代码]=[代码][代码]"customSwiper"[代码][代码]>[代码][代码] [代码][代码]<[代码][代码]swiper[代码] [代码]class[代码][代码]=[代码][代码]"banner"[代码] [代码]autoplay[代码][代码]=[代码][代码]"true"[代码] [代码]interval[代码][代码]=[代码][代码]"2000"[代码] [代码]duration[代码][代码]=[代码][代码]"300"[代码] [代码]bindchange[代码][代码]=[代码][代码]"switchTab"[代码][代码]>[代码][代码] [代码][代码]<[代码][代码]block[代码] [代码]wx:for[代码][代码]=[代码][代码]"{{sliderList}}"[代码][代码]>[代码][代码] [代码][代码]<[代码][代码]swiper-item[代码][代码]>[代码][代码] [代码][代码]<[代码][代码]image[代码] [代码]style[代码][代码]=[代码][代码]"width:100%;height:100%"[代码] [代码]src[代码][代码]=[代码][代码]"{{item.imageSource}}"[代码][代码]/>[代码][代码] [代码][代码]</[代码][代码]swiper-item[代码][代码]>[代码][代码] [代码][代码]</[代码][代码]block[代码][代码]>[代码][代码] [代码][代码]</[代码][代码]swiper[代码][代码]>[代码] [代码] [代码][代码]<[代码][代码]view[代码] [代码]class[代码][代码]=[代码][代码]"tab"[代码][代码]>[代码][代码] [代码][代码]<[代码][代码]block[代码] [代码]wx:for[代码][代码]=[代码][代码]"{{sliderList}}"[代码][代码]>[代码][代码] [代码][代码]<[代码][代码]view[代码] [代码]wx:if[代码][代码]=[代码][代码]"{{item.selected}}"[代码] [代码]class[代码][代码]=[代码][代码]"tab-item.selected"[代码][代码]>{{index+1}}</[代码][代码]view[代码][代码]>[代码][代码] [代码][代码]<[代码][代码]view[代码] [代码]wx:else [代码][代码]class[代码][代码]=[代码][代码]"tab-item"[代码][代码]>{{index+1}}</[代码][代码]view[代码][代码]>[代码][代码] [代码][代码]</[代码][代码]block[代码][代码]>[代码][代码] [代码][代码]</[代码][代码]view[代码][代码]>[代码] [代码]</[代码][代码]view[代码][代码]>[代码]
2019-10-20