您的位置:首页 >知识百科 >

垃圾分类宣传小程序(垃圾分类小程序)

你们好,最近小时发现有诸多的小伙伴们对于垃圾分类宣传小程序,垃圾分类小程序这个问题都颇为感兴趣的,今天小活为大家梳理了下,一起往下看看吧。

1、 打开微信小程序开发工具后,我们首先要做的就是编写小程序的第一页,也就是小程序的wxml文件。

2、 主查询代码:

3、 view class='formcss'

4、 form bindsubmit='formSubmit' report-submit='true'

5、 view class='page_row' bindtap='suo'

6、 view class='df search_arr'

7、 icon class='searchcion' color='#00a7f4' size='20' type='search'/icon

8、 输入class='' placeholder='请输入关键字value=' { {搜索值} } ' bind input='搜索值输入'/

9、 /view

10、 Button class=' Search' Form Type=' Submit' Query/button

11、 /view

12、 /form

13、 /view

14、 前台页面写好了,接下来我们会打开相应的js文件,实现查询功能的代码。

15、 ,可以看到查询按钮绑定了一个:表单绑定提交='表单提交'报告-提交='真'

16、 index.js的代码实现:

17、 formSubmit:function(e){

18、 wx.showLoading({

19、 标题:“识别.”,

20、 })

21、 console.log(e.detail.formId)

22、 var that=this;

23、 wx.request({

24、 url: app.globalData.serverUrl + '/laji/api.php?action=ss_forkey',

25、 header: {

26、 'Content-Type': 'application/x-www-form-urlencoded'

27、 },

28、 method: 'POST',

29、 dataType: 'json',

30、 data: {

31、 key: this.data.searchValue,

32、 formid: e.detail.formId

33、 },

34、 success: function (res) {

35、 console.log(res.data)

36、 that.setshowitem();

37、 that.setData({ isshowmain:false});

38、 if (res.data.typeid==1) {

39、 that.setData({ ishowtime1: true});

40、 } else if (res.data.typeid==2) {

41、 that.setData({ ishowtime2: true });

42、 } else if (res.data.typeid==3) {

43、 that.setData({ ishowtime3: true });

44、 } else if (res.data.typeid==4) {

45、 that.setData({ ishowtime4: true });

46、 } else {

47、 that.setData({ ishownokey: true });

48、 }

49、 },

50、 fail: function (error) {

51、 wx.hideLoading();

52、 wx.showToast({

53、 标题:“请求超时”,

54、 icon: 'loading',

55、 duration: 2000

56、 });

57、 console.log(error)

58、 },

59、 complete: function () {

60、 wx.hideLoading();

61、 }

62、 })

63、 }

64、 通过wx.request函数将用户搜索到的垃圾名字提交给小程序进行后天处理,后台处理查询完成后将查询结果输出到前台显示。比如我们搜索:“电池”前台把电池传输到后台。

65、 查询结果为“有害垃圾”,我们将显示给用户:

66、 这样就完成了垃圾分类查询小程序的文本查询功能。关于后台垃圾分类的检索和处理,有很多方法,我用的后台服务是php。

以上就是垃圾分类小程序这篇文章的一些介绍,希望对大家有所帮助。

免责声明:本文由用户上传,如有侵权请联系删除!