// myComponents/myInput/myInput.js const api = require('../../api/index') Component({ options: { multipleSlots: true // 在组件定义时的选项中启用多slot支持 }, /** * 组件的属性列表 */ properties: { value:{ type:String, value:'', observer:function(val){ this.changeContent(val) } }, // placeholder:{ // type:String, // value:'请输入' // }, showEdit:{ type:Boolean, value:true }, ownner:{ type:Boolean, value:true }, filePath:{ type:String, value:'', observer:function(val){ this.changePath(val) } } }, // 监听传入的变量,当传入的值发生变化时,触发方法 observers: { 'value': function (val) { // console.log(val); } }, /** * 页面的初始数据 */ data: { searchType:[ { label:'按产品查', value:'key', placeholder:'请输入产品相关关键词' }, { label:'按公司查', value:'companyName', placeholder:'请输入公司名称' } ], field:'key', lastField:'', placeholder:'请输入产品相关关键词', content:'', show:false, fileList:[] }, methods:{ changeSearchType(e){ // var field = e.detail var lastField = this.data.field var {field} = e.currentTarget.dataset var obj = this.data.searchType.find(item=>{ return item.value == field }) this.setData( { field:field, lastField:lastField, placeholder:obj.placeholder } ) this.triggerEvent('changeSearchType',field) }, changeInput(e){ const value = e.detail.value; this.changeContent(value) this.triggerEvent("input", value,this.data.field); }, inputBlur(e){ const value = e.detail.value; if(value == this.data.content){ return false } this.changeContent(value) this.triggerEvent("change", value,this.data.field); }, changeContent(value){ this.setData( { content:value } ) }, changePath(value){ if(!value){ return } this.setData( { fileList:[ { url: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){ if(this.data.content.trim() == ''){ wx.showToast({ title: '检索内容不能为空', icon:'none' }) return false } if(this.properties.ownner){ var isLogin = api.isLogin() if(!isLogin){ return false } var params = { // key:this.data.content } params[this.data.field] = this.data.content if(this.data.fileList && this.data.fileList.length>0){ params.filePath = this.data.fileList[0].url } var product = JSON.stringify(params) console.log(product) wx.navigateTo({ url: '/pages/searchResults/searchResults?type=0&product='+encodeURIComponent(product), }) } // console.log(e,this.properties.value) var data = { value:this.data.content, field:this.data.field, lastField:this.data.lastField, } if(this.data.fileList && this.data.fileList.length>0){ data.filePath = this.data.fileList[0].url }else{ data.filePath = '' } this.triggerEvent('search',data) }, //图片上传 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: { // ... } })