미니 프로그램의 피커 데이터는 Object Array입니다.

피커 컴포넌트를 동작시킬 때 렌더링 문제가 왜 발생하는지 의구심이 들 수도 있고, 그냥 중국값만 구하고 싶은데 어떻게 해야 하나요?

View 레이어

<view>数据是json的，直接展示</view>
picker使用说明：

<picker 
    mode="selector" 
    range-key="valuess" 
    range=&#39;{{school}}&#39; 
    model:value="{{currentSchool}}" 
    bindchange="handleChange"
>
  当前选择 {{school[currentSchool].valuess}}
  
</picker>

Logic 레이어

page({
    data: {
        school: [
            {"isNewRecord":false,"id":"2","keyss":"school","valuess":"湖南小学"},
            {"isNewRecord":false,"id":"3","keyss":"school","valuess":"北京小学"}
        ],
        currentSchool: ""
    }
    handleChange(e) {
        console.log(e)
        // 如果 range是一个 Object Array形式的，那这里的value就是索引下标
        let currentVal = e.detail.value
    
        // 对应的中文是
        let text = this.data.school[currentVal].valuess
        console.log('中文-->', text)
    },
})

여기서 전달하는 것은 배열 객체 Object Array 유형이므로 선택기 구성 요소를 사용할 때 이러한 필드의 의미와 값을 얻는 방법을 구별해야 합니다

range-key는 렌더링 시 값을 얻기 위해 어떤 필드를 사용하는지 알려줍니다. 매우 간단한 데이터 구조라면 다음과 같습니다. school: ["중국어", '수학', "음악"]

을 지정할 필요가 없습니다. 복잡한 데이터 구조 및 지정된 필드의 경우 WeChat이 자동으로 값을 할당합니다

저자: Zhiliao Qingyu

model:value="{{currentSchool}}" 모델이 value 앞에 바인딩된 이유는 무엇인지 알 수 있습니다

WeChat은 양방향 데이터 바인딩이 아니기 때문에 간단히 value="{{현재 아래에 작성하면 됩니다. selected index Marked - currentSchool}}"

논리 계층의 currentSchool은 변경되지 않습니다. 데이터의 데이터는 반드시 바인딩 변경 이벤트를 통해 수정되어야 합니다. 다음과 같습니다

handleChange(e) {
    this.setData({
       currentSchool: e.detail.value
    })
}

모델을 사용하면 연결할 필요가 없다는 장점이 있습니다. 오른쪽 상단에서 확인을 클릭하면 데이터의 currentSchool이 업데이트됩니다. 취소를 클릭하면 데이터의 데이터가 업데이트되지 않습니다

e.detail.value에서 얻은 값 handlerChange의 내용은 다음과 같습니다. 사실 우리는 텍스트 텍스트를 원할 수도 있습니다

위와 마찬가지로 인덱스를 사용하여 소스 데이터에서 {} 객체 특성을 가져옵니다.

학교를 변경하는 일반적인 작업도 있습니다.-schoolFilter into ["Hunan Primary School", "Beijing Primary School"] 이 간단한 구조로 얻은 e.detail.value는 중국어입니다

그러나 이 요구 사항의 경우 데이터에는 schoolFilter--배열 유형과 학교라는 두 개의 배열이 있습니다. --객체 배열 유형, 선택기에서 range = "{{schoolFilter}}" 사용

그런 다음 원본 데이터의 다른 속성을 얻으려면 학교를 순회한 다음 값을 가져와야 합니다

Summary

If 데이터 데이터를 변경하기 위해 바인딩 변경을 작성하고 싶지 않다면 model을 사용하세요.
picker 시작 태그와 끝 태그의 패키지는 텍스트 렌더링을 사용하여 원하는 대로 구성할 수 있습니다. {content}} 렌더링 또는 뷰 렌더링 또는 입력 렌더링
객체 배열 가져오기 데이터의 다른 필드에 대해 데이터를 필터링하지 않으려면 객체 배열 구조를 사용하고 인덱스를 통해 액세스하세요. 데이터에 2개의 필드를 만들 필요가 없습니다
피커에 표시된 [확인] 버튼만 클릭하면 됩니다. 피커의 데이터가 업데이트됩니다
추천 튜토리얼: "

WeChat Mini Program

"

위 내용은 미니 프로그램의 피커 데이터는 Object Array입니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!