導航:首頁 > 軟體知識 > 小程序如何添加標簽啊

小程序如何添加標簽啊

發布時間:2023-05-13 19:40:08

㈠ 雲平台小程序中怎麼設置價格標簽

到demo1-listde的demo1-listde.wxml添加輸入框和添加按鈕

商品名
<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-listde.wxss添加輸入框和添加按鈕的樣式
input{
border: 1px solid gray;/* 1像素,實心,灰色 */
width: 200px;
}
1
2
3
4
1
2
3
4
保存運行則得到
在這里插入圖片描述
2.到demo1-listde的demo1-listde.js

在頁面頂端設置全局模式
let name = ''
let price = ''
1
2
1
2
獲取用戶輸入的商品名和價格
getName(n) {
name= n.detail.value
},
getPrice(n) {
price= n.detail.value
},
1
2
3
4
5
6
1
2
3
4
5
6
把用戶添加的商品添加到資料庫
addGood() {
console.log('商品名', name)
console.log('商品價格', price)
1
2
3
1
2
3
為了避免代碼重復
把下圖請添加圖片描述
改為
getList(){
wx.cloud.database().collection("goods")
.get()
.then(res=> {
console.log('列表請求成功',res)
this.setData({//把請求的數據賦值給list
list:res.data
})
})
.catch(res=> {
console.log('列表請求失敗',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
為添加商品製作一個成功或失敗提示彈窗
if (name == '') {
wx.showToast({//提示彈窗
icon:'none',
title: '商品名為空',
})
} else if (price == '') {
wx.showToast({//提示彈窗
icon:'none',
title: '價格為空',
})
} else{
console.log('請添加商品')
wx.cloud.database().collection('goods')
.add({
data:{
name: name,
price: price
}
})
.then(res =>{
console.log('添加成功',res)
this.getList()
})
.catch(res =>{
console.log('添加失敗',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,到demo1.1-details的demo1.1-details.wxml添加輸入框和添加按鈕

<view>商品名:{{good.name}},價格:{{good.price}}</view><!-- viem默認有換行的效果 -->
更新商品價格
<input bindinput="getPrice"></input>
<button type="primary" bindtap="update">更新商品價格</button>
1
2
3
4
1
2
3
4
到demo1.1-details的demo1.1-details.wxss添加輸入框和添加按鈕的樣式
input{
border: 1px solid gray;
width: 200px
}
1
2
3
4
1
2
3
4
保存運行得到
在這里插入圖片描述
2.到demo1.1-details的demo1.1-details.js

在頁面頂部添加全局模式

let price = ''
var id = ''
1
2
1
2
把onLoad板塊改為
onLoad(options) {//列表攜帶的數據,傳遞到了onload方法里
console.log('列表攜帶的值',options)
id = options.id
this.getDetail()
}
1
2
3
4
5
1
2
3
4
5
為避免下面代碼出現重復

把下圖的代碼
在這里插入圖片描述
改為

getDetail() {
wx.cloud.database().collection('goods')
.doc(id)
.get()
.then(res=> {
console.log('精品課程詳情頁請求成功',res)
this.setData({
good:res.data
})
})
.catch(res=>{
console.log('精品課程詳情頁請求失敗',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=n.detail.value
}
1
2
3
1
2
3
修改商品的價格
update() {
console.log('新的商品價格',price)
if (price == '') {
wx.showToast({
icon:'none',
title: '價格為空',
})
} else {
wx.cloud.database().collection('goods')
.doc(id)
.update({
data:{
price:price
}
})
.then(res =>{
console.log('更新成功',res)
this.getDetail()
})
.catch(res =>{
console.log('更新失敗',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,到demo1.1-details的demo1.1-details.wxml添加刪除按鈕

<button type='primary' bindtap="delete">刪除當前商品</button>
1
1
2,到demo1.1-details的demo1.1-details.js

添加刪除商品的代碼
delete() {
console.log('點擊了刪除鍵',id)
wx.showModal({
title:'提示',
content:'確定要刪除這個商品嗎',
success(res) {
if (res.confirm) {
console.log('確定')
//從資料庫刪除數據
wx.cloud.database().collection('goods')
.doc(id)
.remove()
.then(res => {
console.log('刪除完成',res)
wx.navigateTo({
url: '/pages/demo1-list/demo1-list',
})
})
.catch(res=>{
console.log('刪除失敗',err)
})
}else if (res.cancel) {
console.log('取消')
}
}
})
}
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-list.js
let name = ''
let price = ''
Page({
onLoad(){
this.getList()
},
//獲取列表數據
getList(){
wx.cloud.database().collection("goods")
.get()
.then(res=> {
console.log('列表請求成功',res)
this.setData({//把請求的數據賦值給list
list:res.data
})
})
.catch(res=> {
console.log('列表請求失敗',err)
})

},
//跳轉到精品課程詳情頁
toDetail(n) {
console.log('跳轉到精品課程詳情頁的id',n.currentTarget.dataset.id)
wx.navigateTo({
url: '/pages/demo1.1-details/demo1.1-details?id=' + n.currentTarget.dataset.id,//跳轉到商品詳情頁,並攜帶商品id
})
},

//獲取用戶輸入的商品名和價格
getName(n) {
name= n.detail.value
},
getPrice(n) {
price= n.detail.value
},
//添加商品到資料庫
addGood() {
console.log('商品名', name)
console.log('商品價格', price)

if (name == '') {
wx.showToast({//提示彈窗
icon:'none',
title: '商品名為空',
})
} else if (price == '') {
wx.showToast({//提示彈窗
icon:'none',
title: '價格為空',
})
} else{
console.log('請添加商品')
wx.cloud.database().collection('goods')
.add({
data:{
name: name,
price: price
}
})
.then(res =>{
console.log('添加成功',res)
this.getList()
})
.catch(res =>{
console.log('添加失敗',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-list.wxml
商品名
<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}}">商品名:{{item.name}},價格:{{item.price}} </view>
</view>
1
2
3
4
5
6
7
8
1
2
3
4
5
6
7
8
demo1-list.wxss
input{
border: 1px solid gray;/* 1像素,實心,灰色 */
width: 200px;
}
1
2
3
4
1
2
3
4
demo1.1-details.js
let price = ''
var id = ''
Page({
data:{
good:{}
},
onLoad(options) {//列表攜帶的數據,傳遞到了onload方法里
console.log('列表攜帶的值',options)
id = options.id
this.getDetail()
},
//獲取商品的數據
getDetail() {
wx.cloud.database().collection('goods')
.doc(id)
.get()
.then(res=> {
console.log('精品課程詳情頁請求成功',res)
this.setData({
good:res.data
})
})
.catch(res=>{
console.log('精品課程詳情頁請求失敗',err)
})
},

//獲取新價格
getPrice(n) {
price=n.detail.value
},
//修改商品價格
update() {
console.log('新的商品價格',price)
if (price == '') {
wx.showToast({
icon:'none',
title: '價格為空',
})
} else {
wx.cloud.database().collection('goods')
.doc(id)
.update({
data:{
price:price
}
})
.then(res =>{
console.log('更新成功',res)
this.getDetail()
})
.catch(res =>{
console.log('更新失敗',err)
})

}
},
delete() {
console.log('點擊了刪除鍵',id)
wx.showModal({
title:'提示',
content:'確定要刪除這個商品嗎',
success(res) {
if (res.confirm) {
console.log('確定')
//從資料庫刪除數據
wx.cloud.database().collection('goods')
.doc(id)
.remove()
.then(res => {
console.log('刪除完成',res)
wx.navigateTo({
url: '/pages/demo1-list/demo1-list',
})
})
.catch(res=>{
console.log('刪除失敗',err)
})
}else if (res.cancel) {
console.log('取消')
}
}
})
}

})
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
demo1.1-details.wxml
<!--pages/demo1.1-details/demo1.1-details.wxml-->
<view>商品名:{{good.name}},價格:{{good.price}}</view><!-- viem默認有換行的效果 -->
更新商品價格
<input bindinput="getPrice"></input>
<button type="primary" bindtap="update">更新商品價格</button>
<button type='primary' bindtap="delete">刪除當前商品</button>

demo1.1-details.wxss

㈡ 微信小程序雙標簽怎麼打開

微信小程序的雙標簽模式是一種方便的多任務瀏覽模式。通過雙標簽模式,你可以在同一屏幕內同時打基旅則悄開兩個不同的小程序,實現多任務瀏覽和操作。

要使用微信小程序雙標簽模式,可以按照以下步驟進行操作:

1. 打開微信並進入小程序界面。
2. 點擊右上角的「+」號,選擇第一搏盯凳個小程序並進入。
3. 在第一個小程序中,向上滑動屏幕,並點擊「添加標簽頁」按鈕(圖標為「+」和「⦁」組成),再選擇要打開的第二個小程序。
4. 此時,第二個小程序就會在新的標簽頁中打開,你可以在同一屏幕上同時瀏覽和操作兩個小程序了。
5. 如果需要關閉某個標簽頁,可以點擊標簽頁上的「×」按鈕來關閉。

需要注意的是,並不是所有的微信小程序都支持雙標簽模式。如果你發現在某些小程序中沒有「添加標簽頁」按鈕,則該小程序可能不支持雙標簽模式。同時,在雙標簽模式下,你需要注意你的設備屏幕大小和解析度,以避免操作不便或界面擁擠的情況發生。

㈢ 如何在小程序二維碼中添加文字

近來有客戶咨詢,二維碼和二維碼下面的文字是不是一體的。如果不是一體的,那二維碼下面的文字標識是如何添加的。今天就給大家演示下二維碼軟體添加文字標識的步驟:

打開二維碼軟體,新建標簽之後,點擊左側的「二維碼」按鈕,在畫布上繪制一個二維碼樣式,雙擊二維碼,在圖形屬性-數據源中,點擊「修改」按鈕,數據對象類型選擇「手動輸入」,在下面的狀態框中手動輸入要編輯的信息,點擊編輯-確定。

㈣ 微信小程序怎麼添加頂部標簽分頁欄

對於目前最新6.5.3版本的微信,從聊天頂部的入口處點擊進入該小程序,然後點擊左上角的關閉,試試,我這目前可以

㈤ 微信小程序列表裡小程序的標簽怎麼出來的

這個是功能模塊,而不是你說的標簽,前提是你的微信小程序有優惠券這個功能模塊,每個小程序都會有不同的功能模塊,這個模塊是開發商給你開發出來的,假如你的小程序沒有這個模塊,根本就不會出現。

㈥ 想在微信小程序設置用戶標簽,請問怎麼弄

微信小程序裡面設置用戶的標簽,請問怎麼弄來說的話?你們自己用的標簽來說的話,自己的話就是進入他的小程序的設置,裡面的話就是設置出來他的任務標簽就可以

㈦ 抖音蘋果6手機沒有添加標簽功能小程序

抖音蘋果6手機有添加標簽功能小程序
1、手機打開抖音,點擊+後再點擊頁面紅圈拍短視頻。
2、拍完後在發布頁面里點擊添加標簽,選擇合適的標
簽。
3、選擇合適片名,點擊右側的添加。
4、選擇好了之後點擊發布即可在頁面上顯示標簽。

閱讀全文

與小程序如何添加標簽啊相關的資料

熱點內容
如何查看亞馬遜產品的倉儲費 瀏覽:252
da6是什麼產品 瀏覽:952
股票高頻交易會怎麼樣 瀏覽:209
非食用鈉鹽可以哪些產品 瀏覽:29
市場交易需要哪些條件 瀏覽:853
轉生成為骷髏在哪個程序中下載 瀏覽:85
美食微商怎麼曬日常產品 瀏覽:856
寵物怎麼能交易 瀏覽:783
黃金市場有什麼商機 瀏覽:219
章丘二手車市場在哪裡 瀏覽:1
培訓it失敗了還能學什麼技術 瀏覽:751
哪些是英文文獻資料庫 瀏覽:500
酒吧市場計劃怎麼寫 瀏覽:774
死亡數據榜單在哪裡看 瀏覽:53
養豬技術大全豬飼料預混料是什麼 瀏覽:757
三軸銑床程序里有g94會怎麼樣 瀏覽:804
人事代理中心是什麼 瀏覽:753
化學品安全技術是哪個部門 瀏覽:923
法本信息股價為什麼20多了 瀏覽:738
來威信息登記多久有效 瀏覽:641