먼저 이전 홈페이지 인터페이스 표시를 계속하고 여러 점프 탐색기를 사용한 다음 각 기능 모듈의 기능을 사용하십시오.
1. 텍스트 표시
버튼을 사용하여 텍스트를 추가하고 줄입니다. 🎜>텍스트 표시
{{text}}
텍스트 추가
텍스트 줄이기
JS 대화형 작업:
//初始化一个文字参数 var initText = '这是第一个文字n这是第二个文字' Page({ data: { text: initText }, //初始化一个空的文字串 extraLine: [], //添加按钮点击事件 add: function(e) { //在文字串中添加文字,push this.extraLine.push('添加的其他文字') //设置数据 this.setData({ text: initText + 'n' + this.extraLine.join('n') }) }, //减少按钮点击事件 remove: function(e) { //判断文字串是否大于0,如果大于0,减少,反之,不操作 if (this.extraLine.length > 0) { //在文字串中减少文字,pop this.extraLine.pop() //设置数据 this.setData({ text: initText + 'n' + this.extraLine.join('n') }) } } })2. 아이콘 표시, 표시 시스템 구축 -스타일에서는 아이콘 크기
아이콘 표시
아이콘 크기 스타일
아이콘 유형
아이콘 색상 스타일
JS 대화형 작업:
//.js Page({ data: { iconSize: [20, 30, 40, 50, 60, 70], iconColor: [ 'red', 'orange', 'yellow', 'green', 'rgb(0,255,255)', 'blue', 'purple' ], iconType: [ 'success', 'info', 'warn', 'waiting', 'safe_success', 'safe_warn', 'success_circle', 'success_no_circle', 'waiting_circle', 'circle', 'download', 'info_circle', 'cancel', 'search', 'clear' ] } })3. 진행률 표시, 진행률 표시줄 스타일 디자인
진행률 표시줄 표시
4. 네비게이터 탐색 표시: 두 가지 형태로 구분, 1. 새로운 인터페이스로 이동, 2 .현재 인터페이스 점프
네비게이터 표시
새 페이지로 이동