// myComponents/myInput/myInput.js Component({ options: { multipleSlots: true // 在组件定义时的选项中启用多slot支持 }, /** * 组件的属性列表 */ properties: { value:{ type:String, value:'' }, placeholder:{ type:String, value:'请输入' }, showEdit:{ type:Boolean, value:true } }, // 监听传入的变量,当传入的值发生变化时,触发方法 observers: { 'value': function (val) { // console.log(val); } }, /** * 页面的初始数据 */ data: { content:'', show:false, fileList:[] }, methods:{ changeInput(e){ const value = e.detail.value; this.triggerEvent("input", value); }, inputBlur(e){ const value = e.detail.value; if(value == this.data.content){ return false } this.changeContent(value) this.triggerEvent("change", value); }, changeContent(value){ this.setData( { content:value } ) }, clickInnerIcon(e){ if(this.properties.showEdit){ // this.data.show = !this.data.show this.setData( { show:!this.data.show } ) } console.log(this.properties.showEdit,this.data.show) this.triggerEvent('clickInnerIcon',1) }, buttonClick(e){ // console.log(e,this.properties.value) this.triggerEvent('search',1) }, //图片上传 beforeUpload(e){ console.log(e.detail) if(e.detail.errMsg=="chooseMedia:ok"){ var data = [{ status: 'done', url: e.detail.tempFiles[0].tempFilePath, }] this.setData({ fileList:data }) } }, onChange(e) { console.log('1', e) const { file, fileList } = e.detail if (file.status === 'uploading') { this.setData({ progress: 0, }) wx.showLoading() } else if (file.status === 'done') { this.setData({ imageUrl: file.url, }) } // Controlled state should set fileList this.setData({ fileList }) }, //预览 onPreview(e) { console.log('onPreview', e) const { file, fileList } = e.detail wx.previewImage({ current: file.url, urls: fileList.map((n) => n.url), }) }, }, /** * 组件的生命周期函数列表 */ lifetimes: { // 在组件实例进入页面节点树时执行 attached: function () { // 初始化操作 // console.log('组件初始化'); this.changeContent(this.properties.value) // ... }, // 在组件实例被移除出页面节点树时执行 detached: function () { // 清理工作 console.log('组件销毁'); // ... }, // ... }, /** * 组件所在页面的生命周期函数可以在 pageLifetimes 中定义 * * 页面生命周期函数: * show:页面显示 * hide:页面隐藏 * resize:页面尺寸变化 */ pageLifetimes: { // ... } })