我来具体分析下你的问题。
校园物流小程序,从title可以看出来,你是想做一个针对学校用户特定群体的物流信息软件,可能会对接所有物流公司系统的下单收件,物流信息查询跟踪,包裹签收等接口,能够让校园用户外爷这个小程序里解决一站式收发快递,快递信息跟踪查询的功能,能大大的方便校园用户。
收软件收益来看,看你是做公益类型的,还是做收费或者赚钱类型的(当然赚钱的方式有好多种,并不一定是直接的收费)。但是从软件市场来看,这种软件其实已经很多了。支付宝里,小米手机里,等都有这类功能。所以,做这个小程序的意义不大。
以上,谢谢!
到demo1-listde的demo1-listdewxml添加输入框和添加按钮
商品名
<input bindinput="getName"></input>
商品价格
<input bindinput="getPrice"></input><!-- 输入框 -->
<button bindtap="addGood" type="primary">添加商品</button><!-- 添加按钮 -->
1
2
3
4
5
1
2
3
4
5
到demo1-listde的demo1-listdewxss添加输入框和添加按钮的样式
input{
border: 1px solid gray;/ 1像素,实心,灰色 /
width: 200px;
}
1
2
3
4
1
2
3
4
保存运行则得到
在这里插入描述
2到demo1-listde的demo1-listdejs
在页面顶端设置全局模式
let name = ''
let price = ''
1
2
1
2
获取用户输入的商品名和价格
getName(n) {
name= ndetailvalue
},
getPrice(n) {
price= ndetailvalue
},
1
2
3
4
5
6
1
2
3
4
5
6
把用户添加的商品添加到数据库
addGood() {
consolelog('商品名', name)
consolelog('商品价格', price)
1
2
3
1
2
3
为了避免代码重复
把下图请添加描述
改为
getList(){
wxclouddatabase()collection("goods")
get()
then(res=> {
consolelog('列表请求成功',res)
thissetData({//把请求的数据赋值给list
list:resdata
})
})
catch(res=> {
consolelog('列表请求失败',err)
})
1
2
3
4
5
6
7
8
9
10
11
12
1
2
3
4
5
6
7
8
9
10
11
12
为添加商品制作一个成功或失败提示d窗
if (name == '') {
wxshowToast({//提示d窗
icon:'none',
title: '商品名为空',
})
} else if (price == '') {
wxshowToast({//提示d窗
icon:'none',
title: '价格为空',
})
} else{
consolelog('请添加商品')
wxclouddatabase()collection('goods')
add({
data:{
name: name,
price: price
}
})
then(res =>{
consolelog('添加成功',res)
thisgetList()
})
catch(res =>{
consolelog('添加失败',err)
})
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
保存运行即可在小程序页面添加商品和价格
更改商品价格
1,到demo11-details的demo11-detailswxml添加输入框和添加按钮
<view>商品名:{{goodname}},价格:{{goodprice}}</view><!-- viem默认有换行的效果 -->
更新商品价格
<input bindinput="getPrice"></input>
<button type="primary" bindtap="update">更新商品价格</button>
1
2
3
4
1
2
3
4
到demo11-details的demo11-detailswxss添加输入框和添加按钮的样式
input{
border: 1px solid gray;
width: 200px
}
1
2
3
4
1
2
3
4
保存运行得到
在这里插入描述
2到demo11-details的demo11-detailsjs
在页面顶部添加全局模式
let price = ''
var id = ''
1
2
1
2
把onLoad板块改为
onLoad(options) {//列表携带的数据,传递到了onload方法里
consolelog('列表携带的值',options)
id = optionsid
thisgetDetail()
}
1
2
3
4
5
1
2
3
4
5
为避免下面代码出现重复
把下图的代码
在这里插入描述
改为
getDetail() {
wxclouddatabase()collection('goods')
doc(id)
get()
then(res=> {
consolelog('精品课程详情页请求成功',res)
thissetData({
good:resdata
})
})
catch(res=>{
consolelog('精品课程详情页请求失败',err)
})
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
1
2
3
4
5
6
7
8
9
10
11
12
13
14
获取新价格
getPrice(n) {
price=ndetailvalue
}
1
2
3
1
2
3
修改商品的价格
update() {
consolelog('新的商品价格',price)
if (price == '') {
wxshowToast({
icon:'none',
title: '价格为空',
})
} else {
wxclouddatabase()collection('goods')
doc(id)
update({
data:{
price:price
}
})
then(res =>{
consolelog('更新成功',res)
thisgetDetail()
})
catch(res =>{
consolelog('更新失败',err)
})
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
保存运行即可更改商品的价格
删除商品
1,到demo11-details的demo11-detailswxml添加删除按钮
<button type='primary' bindtap="delete">删除当前商品</button>
1
1
2,到demo11-details的demo11-detailsjs
添加删除商品的代码
delete() {
consolelog('点击了删除键',id)
wxshowModal({
title:'提示',
content:'确定要删除这个商品吗',
success(res) {
if (resconfirm) {
consolelog('确定')
//从数据库删除数据
wxclouddatabase()collection('goods')
doc(id)
remove()
then(res => {
consolelog('删除完成',res)
wxnavigateTo({
url: '/pages/demo1-list/demo1-list',
})
})
catch(res=>{
consolelog('删除失败',err)
})
}else if (rescancel) {
consolelog('取消')
}
}
})
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
保存运行即可
完成后的全部代码
demo1-listjs
let name = ''
let price = ''
Page({
onLoad(){
thisgetList()
},
//获取列表数据
getList(){
wxclouddatabase()collection("goods")
get()
then(res=> {
consolelog('列表请求成功',res)
thissetData({//把请求的数据赋值给list
list:resdata
})
})
catch(res=> {
consolelog('列表请求失败',err)
})
},
//跳转到精品课程详情页
toDetail(n) {
consolelog('跳转到精品课程详情页的id',ncurrentTargetdatasetid)
wxnavigateTo({
url: '/pages/demo11-details/demo11-detailsid=' + ncurrentTargetdatasetid,//跳转到商品详情页,并携带商品id
})
},
//获取用户输入的商品名和价格
getName(n) {
name= ndetailvalue
},
getPrice(n) {
price= ndetailvalue
},
//添加商品到数据库
addGood() {
consolelog('商品名', name)
consolelog('商品价格', price)
if (name == '') {
wxshowToast({//提示d窗
icon:'none',
title: '商品名为空',
})
} else if (price == '') {
wxshowToast({//提示d窗
icon:'none',
title: '价格为空',
})
} else{
consolelog('请添加商品')
wxclouddatabase()collection('goods')
add({
data:{
name: name,
price: price
}
})
then(res =>{
consolelog('添加成功',res)
thisgetList()
})
catch(res =>{
consolelog('添加失败',err)
})
}
}
})
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
demo1-listwxml
商品名
<input bindinput="getName"></input>
商品价格
<input bindinput="getPrice"></input><!-- 输入框 -->
<button bindtap="addGood" type="primary">添加商品</button><!-- 添加按钮 -->
<view wx:for="{{list}}">
<view bindtap="toDetail" data-id="{{item_id}}">商品名:{{itemname}},价格:{{itemprice}} </view>
</view>
1
2
3
4
5
6
7
8
1
2
3
4
5
6
7
8
demo1-listwxss
input{
border: 1px solid gray;/ 1像素,实心,灰色 /
width: 200px;
}
1
2
3
4
1
2
3
4
demo11-detailsjs
let price = ''
var id = ''
Page({
data:{
good:{}
},
onLoad(options) {//列表携带的数据,传递到了onload方法里
consolelog('列表携带的值',options)
id = optionsid
thisgetDetail()
},
//获取商品的数据
getDetail() {
wxclouddatabase()collection('goods')
doc(id)
get()
then(res=> {
consolelog('精品课程详情页请求成功',res)
thissetData({
good:resdata
})
})
catch(res=>{
consolelog('精品课程详情页请求失败',err)
})
},
//获取新价格
getPrice(n) {
price=ndetailvalue
},
//修改商品价格
update() {
consolelog('新的商品价格',price)
if (price == '') {
wxshowToast({
icon:'none',
title: '价格为空',
})
} else {
wxclouddatabase()collection('goods')
doc(id)
update({
data:{
price:price
}
})
then(res =>{
consolelog('更新成功',res)
thisgetDetail()
})
catch(res =>{
consolelog('更新失败',err)
})
}
},
delete() {
consolelog('点击了删除键',id)
wxshowModal({
title:'提示',
content:'确定要删除这个商品吗',
success(res) {
if (resconfirm) {
consolelog('确定')
//从数据库删除数据
wxclouddatabase()collection('goods')
doc(id)
remove()
then(res => {
consolelog('删除完成',res)
wxnavigateTo({
url: '/pages/demo1-list/demo1-list',
})
})
catch(res=>{
consolelog('删除失败',err)
})
}else if (rescancel) {
consolelog('取消')
}
}
})
}
})
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
demo11-detailswxml
<!--pages/demo11-details/demo11-detailswxml-->
<view>商品名:{{goodname}},价格:{{goodprice}}</view><!-- viem默认有换行的效果 -->
更新商品价格
<input bindinput="getPrice"></input>
<button type="primary" bindtap="update">更新商品价格</button>
<button type='primary' bindtap="delete">删除当前商品</button>
demo11-detailswxss
小程序的名称可以修改,修改的具体 *** 作步骤如下:
我们需要准备的材料有:电脑、微信公众号
1、首先我们进入微信公众号平台,点击左侧“设置”选项。
2、然后我们在该页面中单击基本设置信息,然后点击名称右侧“修改”选项。
3、之后我们在该页面中根据自己的喜好修改名称点击“确定”选项即可。
微信小程序自带的API中的页面交互功能,虽然提示功能非常全面,但是所有的交互API中是没有可以自己在提示框中输入文本的功能,那么现在我们来自己做这样的一个提示框(可以带有输入功能),在提示框输入完内容之后,点击确定,可以将文本内容返回,点击取消则可以回到之前的状态。
(在这里,主页面的布局可以根据每个人的想法来布局,这里展示的css之后展示提示框部分的)
1、首先打开微信开发者工具,建立一个代码模板,那么我们这个提示框就是写在这个页面上。
这里我们主页面叫做index
2、在基本页面中写上一个姓名的文本,当前姓名用<text>{{stuName}}</text>表示,然后为一个button按钮,再在js文件中,建立相应的点击事件以及stuName的信息。这样,一个原始页面就写好了。
下面我们开始d出框页面的制作
<view class='toast-box' hidden='{{!ifName}}'>
<view class='toastbg'></view>
<view class='showToast'>
<view class='toast-title'>
<text>修改姓名</text>
</view>
<view class='toast-main'>
<view class='toast-input'>
<input placeholder='请输入姓名' bindinput='setValue' data-name='stuEidtName'></input>
</view>
</view>
<view class='toast-button'>
<view class='button1'>
<button catchtap='cancel'>取消</button>
</view>
<view class='button2'>
<button catchtap='confirm'>确定</button>
</view>
</view>
</view>
</view>
3、我们可以发现,点击按钮后d出输入框,如果点击除取消和确定之外的地方,是不会有反应的。为了做到这个功能,我们用一个绝对位置的渲染层(toastbg),覆盖住整个页面,并且如果你的页面长度没有滚动的话,请输入min—height:100vh,如果页面发生滚动,请把长度控制在height:100%即可看到整个页面都被覆盖。并且这个覆盖的页面要表现为透明,opacity:02,即可
4、bindinput为写文本时所触发的事件,data-name为文本数据所保存的地方,在js中我们可以把这个数据打印出来,会发现我们所输入的文本信息。
以下为css的代码
toast-box {
width: 100%;
height: 100%;
opacity: 1;
position: fixed;
top: 0px;
left: 0px;
}
toastbg {
opacity: 02;
background-color: black;
position: absolute;
width: 100%;
min-height: 100vh;
}
showToast {
position: absolute;
opacity: 1;
width: 70%;
margin-left: 15%;
margin-top: 40%;
}
toast-title {
padding-left: 5%;
background-color: #2196f3;
color: white;
padding-top: 2vh;
padding-bottom: 2vh;
border-top-right-radius: 16rpx;
border-top-left-radius: 16rpx;
}
toast-main {
padding-top: 2vh;
padding-bottom: 2vh;
background-color: white;
text-align: center;
}
toast-input {
margin-left: 5%;
margin-right: 5%;
border: 1px solid #ddd;
padding-left: 2vh;
padding-right: 2vh;
padding-top: 1vh;
padding-bottom: 1vh;
}
toast-button {
display: flex;
}
button1 {
width: 50%;
}
button2 {
width: 50%;
}
button1 button {
width: 100%;
background-color: white;
color: red;
border-radius: 0px;
border-bottom-left-radius: 16rpx;
}
button2 button{
width: 100%;
background-color: white;
color: black;
border-radius: 0px;
border-bottom-right-radius: 16rpx;
}
picker {
padding-top: 1vh;
padding-bottom: 1vh;
}
我们可以根据自己的喜欢,对提示框的样式进行改变
5、编写js代码,我们需要实现以下一些基本功能(点击出现d窗,取消不改变数据值,确定进行判断数据值,若为空则不能改变,否则可以改变,并且主页面上的内容要变为相应改变后的内容)
6、给最外层的d窗附上hidden(如图所示),为这个值初始为false,点击按钮后触发事件,改false为true,这样即可点击出现d窗。
7、为取消按钮附上点击事件,与hidden的部分刚好相反即可。
8、为书写文本绑定事件,上述代码中命名为setValue,这个函数我们传入一个event进去,将其打印,我们可以发现在其的detail中有我们刚刚所书写的内容,我们将这个值,传给js中data一个属性,这里我们命名为edit。
9、为确定绑定事件,用thisdataedit将这个值进行判断,若为空,我们用wxshowToast提示用户信息没有填写完整,并且页面不会改变。若不为空,则我们setData一下我们的stuName为这个edit的值,并且重新把hidden的属性值改为false。
10、返回到初始页面我们就可以看到我们自己做得一个提示框,并且具有修改值的功能
现在,微信内的搜索功能还在不断强化,搜索结果糅合了大数据等综合算法。有一点尤其值得注意,用户在使用微信搜索时,小程序会被优先显示出来。
开发者可在小程序后台的 “推广” 模块中,配置与小程序业务相关的关键词。关键词在配置生效后,会和小程序的服务质量、用户使用情况、关键词相关性等因素,共同影响搜索结果。
微信小程序可添加几个关键词关键词有什么用小程序关键词攻略网页链接
一、wxsetNavigationBarTitle
1设置整个小程序通用标题,在appjson里设置:
"window": {
"navigationBarTitleText": "默认标题"
}
复制
2单独设置页面标题,在对应页面json文件里设置(子页面设置会覆盖通用设置):
{
"navigationBarTitleText": "首页"
}
复制
3动态设置,比如说:我们从接口拿到商品名称后,把商品名称设置到标题上
wxrequest({
url: "请求接口url",
method: "POST",
data: {},
success: function (res) {
if (resdatacode == 200) {
// 修改navigationBarTitleText
wxsetNavigationBarTitle({
title: goods_name
})
}
}
})
复制

tips:动态设置 > 页面独立设置 > 通用设置
效果图:
当然,另外我们可以通过点击事件来动态设置标题:
test: function () {
wxsetNavigationBarTitle({
title: "我是点击后的标题"
})
}
复制
效果图:
二、wxsetNavigationBarColor
设置页面导航条颜色
wxsetNavigationBarColor({
frontColor: '#ffffff',
backgroundColor: '#ff0000',
animation: {
duration: 400,
timingFunc: 'easeIn'
}
})
复制
frontColor:前景颜色值,包括按钮、标题、状态栏的颜色,仅支持 #ffffff 和 #000000
backgroundColor:背景颜色值,有效值为十六进制颜色
animation:动画效果
①animation的结构包括:duration,timingFunc;
②timingFunc:linear(动画从头到尾的速度是相同的),easeIn(动画以低速开始),easeOut(动画以低速结束),easeInOut(动画以低速开始和结束)
效果图:
三、wxshowNavigationBarLoading和wxhideNavigationBarLoading
wxshowNavigationBarLoading:在当前页面显示导航条加载动画
wxhideNavigationBarLoading:在当前页面隐藏导航条加载动画
indexwxml
<button bindtap="showLoading">显示加载动画</button>
<button bindtap="hideLoading">隐藏加载动画</button>
复制
indexjs
// 显示加载动画
showLoading: function () {
wxshowNavigationBarLoading()
},
// 隐藏加载动画
hideLoading: function () {
wxhideNavigationBarLoading()
}
复制
效果图:
四、wxhideHomeButton
隐藏返回首页按钮。微信707版本起,当用户打开的小程序最底层页面是非首页时,默认展示“返回首页”按钮,开发者可在页面 onShow 中调用 hideHomeButton 进行隐藏。
以上就是关于开发校园物流小程序有何意义全部的内容,包括:开发校园物流小程序有何意义、云平台小程序中怎么设置价格标签、小程序的名称可以修改吗等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)