1. 程式人生 > >小程式普通選擇器的rank-key的值必須帶單引號

小程式普通選擇器的rank-key的值必須帶單引號

picker是從底部彈起的滾動選擇器,現支援五種選擇器,通過mode來區分,分別是普通選擇器,多列選擇器,時間選擇器,日期選擇器,省市區選擇器,預設是普通選擇器。

今天在學習的時候 ,做普通選擇器的時候在rank-key這個屬性上面遇到了問題,

官方文件上面的介紹:當 range 是一個 Object Array 時,通過 range-key 來指定 Object 中 key 的值作為選擇器顯示內容

官方文件和例子裡面也沒有相關的例子,剛開始寫的時候是這樣寫的

  <picker bindchange="bindPickerChange" value="{{index}}" range="{{objectArray}}"  range-key="{{name}}"
> <view class="picker"> 當前選擇:{{objectArray[index].name}} </view> </picker>

標紅的位置就是出現問題的地方,原來要選擇某個key的值作為顯示器內容的時候必須要加單引號,如下:

  <picker bindchange="bindPickerChange" value="{{index}}" range="{{objectArray}}"  range-key="{{'name'}}">
    <view class="picker">
      當前選擇:{{objectArray[index].name}}
    </view>
  </picker>
這樣問題就解決了

相關推薦

程式普通選擇rank-key必須引號

picker是從底部彈起的滾動選擇器,現支援五種選擇器,通過mode來區分,分別是普通選擇器,多列選擇器,時間選擇器,日期選擇器,省市區選擇器,預設是普通選擇器。今天在學習的時候 ,做普通選擇器的時候在

微信程式 picker選擇 從後臺拿

這種東西在專案中是很常見的,文件上有的demo我這裡就不在重複一遍了,我現在說的是從後臺拿到的資料,放在這個選擇器裡。 後臺返回的格式是這樣的: 我們要實現的樣子是這樣的: 其實跟文件上介紹的普通選擇器差不多,只是多了幾個條件值, 我們一起來看一下程式碼:主要

程式地區選擇學習連結

學習連結:https://blog.csdn.net/yeshennet/article/details/79031012 <view class="section__title">省市區選擇器</view> <picker mode="region" bindchange=

程式選擇picker使用

wxml: <view class="section_sex" > <image class='star-icon name-star-icon' src='../../image/star.jpg'></image> <view class="

程式 地區選擇 實現、呼叫

php五種設計模式 設計模式 一書將設計模式引入軟體社群,該書的作者是 Erich Gamma、Richard Helm、Ralph Johnson 和 John Vlissides Design(俗稱 “四人幫”)。所介紹的設計模式背後的核心概念非常簡單。經過多年的軟體開

微信程式------聯動選擇

picker 從底部彈起的滾動選擇器,現支援五種選擇器,通過mode來區分,分別是普通選擇器,多列選擇器,時間選擇器,日期選擇器,省市區選擇器,預設是普通選擇器。 先來看看效果圖:       1:

微信程式 城市選擇 城市切換

程式碼很簡單. var city = require('../../utils/city.js'); var app = getApp() Page({ data: { searchLetter: [], showLetter: "",

程式 地區選擇

最近花了兩週時間很急的上線了一個小程式,“CP對對碰“,上線後資料還可以,感覺小程式用來試錯效果很好。今天才算緩過來,所以整理一下這段時間寫的東西。 背景是用了官方API上的地區選擇器具之後點選不了,看報錯是地區的值沒有PUSH進去,而且不是全部機器都有問題。

程式picker選擇

picker選擇器分為三種,普通選擇器,時間選擇器, 日期選擇器 用mode屬性區分,預設是普通選擇器。測試時時間和日期點選無反應不知道是BUG還是啥!沒法手機測試現在也不知道咋回事!!主要屬性:普通選

程式-節點選擇

gettextHeight:function(){ var h=""; ////建立節點選擇器 var query = wx.createSelectorQuery(); // //選擇id query.select('#showtext').boundingClientRect() que

微信程式 圖片選擇

android開發中經常使用到頭像上傳需求,選擇圖片有二種方式,第一種是從相簿中選擇還有一種就是拍攝,小程式也有這個功能,而且比android容易多了, 先看官網給的文件: wx.chooseImage(Object object) 從本地相簿選擇圖片或使用相機拍照

微信程式----picker選擇(picker、省市區選擇)(MUI選擇

效果圖 實現原理 利用微信小程式的picker元件,其中: 1,普通選擇器:mode = selector實現一級選擇例項; 2,省市區選擇器:mode = region實現省市區三級聯動; 3, 多列選擇器:mode

如何獲取程式picker表普通選擇

data: { array: ['夏彤','陳學華','甘廣','黃龍流','李昌略','董俊輝','羅景盛','鍾敏君','林銳','麥健發','曹兵'], objectArray: [ { id: 0, name: '夏彤' }, {

微信程序------聯動選擇

程序 rdate let 簡單 格式 data image 選擇 logs picker 從底部彈起的滾動選擇器,現支持五種選擇器,通過mode來區分,分別是普通選擇器,多列選擇器,時間選擇器,日期選擇器,省市區選擇器,默認是普通選擇器。 先來看看效果圖: 1

css的屬性選擇中屬性是區分大小寫的。

大小寫 現在 適用於 evel rom fire .org nbsp attribute 以前經常看到很多人說“css中通常只有class和id的值區分大小寫,屬性名和屬性值不區分大小寫” BLAH BLAH 接手別人項目的時候排了半天bug發現:css的屬性選擇器對於屬性

css選擇的特殊性

pre 重要性 欄目 頁面設置 html 類名 添加 沒有 bubuko 今天從前端那拿來寫好的頁面,就開始動工,首先,照舊處理導航欄高亮的問題, 說到處理高亮的問題,不同的人會有不同的方法,比如: //類名為nav的元素下的第n個a元素 .nav a:nth-o

vue級聯選擇記錄——存

info 就是 png 返回 數據庫 選項 三級 img nbsp 比如有三級,選擇後返回結果如圖: 那麽選擇完畢後應該存入數據庫裏的最後一級選項的值就是: vue級聯選擇器記錄——存值

程序地區選擇學習鏈接

tail del 改變 選擇器 ons mode tro ron 鏈接 學習鏈接:https://blog.csdn.net/yeshennet/article/details/79031012 <view class="section__title">省市區選

程式跳轉 H5 時 cookie 處理問題

小程式使用 <web-view></web-view> 內嵌 H5,當跳轉至 H5 後,校驗使用者的登入狀態是最重要的。 在做手中的專案 b.xx.com 時,需要呼叫另一個域名下(a.xx.com)的公共地址介面,兩處都需要校驗使用者的登入狀態。 最初的做法是: let

微信程式在編輯上樣式正常,但在手機上不顯示樣式

之前做了個小工具,最近有時間,就加了頁面,在編輯器上的wxss樣式是正常的,但在手機上預覽就無法顯示 我目前只發現了一個顏色問題,但產生問題的真正原因沒去仔細研究,所以以後遇到其他的研究下再寫上來 解決方法: 原因:其他都生效,只是