이번에는 mui 페이지 점프 방법을 알려드리겠습니다. mui 페이지 점프 방법을 사용할 때 주의사항은 무엇인가요?
【페이지를 여는 여러 가지 방법】
1. 초기화 중에 하위 페이지를 만듭니다
2. 새 페이지를 직접 엽니다
3. 페이지를 미리 로드합니다
1. 초기화 서브페이지 만들기
mui.init({ subpages: [{ url: your - subpage - url, //子页面HTML地址,支持本地地址和网络地址 id: your - subpage - id, //子页面标志 styles: { top: subpage - top - position , //子页面顶部位置 bottom: subpage - bottom - position, //子页面底部位置 width: subpage - width, //子页面宽度,默认为100% height : subpage - height, //子页面高度,默认为100% ...... }, extras: {} //额外扩展参数 }] });
2. 새 페이지 직접 열기
mui.openWindow({ url: new - page - url, id: new - page - id, styles: { top: newpage - top - position, //新页面顶部位置 bottom: newage - bottom - position, //新页面底部位置 width: newpage - width, //新页面宽度,默认为100% height: newpage - height, //新页面高度,默认为100% ...... }, extras: { ..... //自定义扩展参数,可以用来处理页面间传值 } show: { autoShow: true, //页面loaded 事件 发生后自动显示,默认为true aniShow: animationType, //页面显示 动画 ,默认为”slide-in-right“; duration: animationTime //页面动画持续时间, Android 平台默认100毫秒,iOS平台默认200毫秒; }, waiting: { autoShow: true, //自动显示等待框,默认为true title: '正在加载...', //等待对话框上显示的提示内容 options: { width: waiting - dialog - widht, //等待框背景区域宽度,默认根据内容自动计算合适宽度 height: waiting - dialog - height, //等待框背景区域高度,默认根据内容自动计算合适高度 ...... } } })
3. 페이지 미리 로드
// 方式1 mui.init({ preloadPages: [{ url: prelaod - page - url, id: preload - page - id, styles: {}, //窗口参数 extras: {}, //自定义扩展参数 subpages: [{}, {}] //预加载页面的子页面 }] }); // 方式2 var page = mui.preload({ url: new - page - url, id: new - page - id, //默认使用当前页面的url作为id styles: {}, //窗口参数 extras: {} //自定义扩展参数 });
【몇 가지 차이점】
1. three 두 가지 방법에서 2와 3에서 열린 페이지는 하위 페이지가 아닙니다. 차이점은 하위 페이지는 HTML의 iframe과 동일하고, 비하위 페이지는 새 브라우저 창을 열고 html
을 로드하는 것과 같습니다.2. 사이드 슬라이딩 메뉴에 적합한 페이지
서브 페이지의 장점이 있는데, 특히 index.html+list.html의 상황에 적합하며,index.html(메인 페이지)로 구현하는 경우 +list.html(하위 페이지), 메인 페이지가 오른쪽으로 슬라이드되면 자동으로 하위 페이지가 따라옵니다. 그리고 index.html(메인 페이지) + list.html(새 페이지)로 구현하면 기본 페이지는 오른쪽으로 슬라이드되지만 새 페이지는 오른쪽으로 슬라이드되지 않으며 새 페이지를 별도로 처리해야 합니다.3. 하위 페이지가 자주 전환됩니다.
좌우로 자주 스와이프하면 구성이 낮은 휴대폰에서는 list.html이 index.html을 덮습니다. 하위 페이지 모드를 사용하면 그렇지 않습니다. 새 페이지 모드를 사용할 가능성이 높습니다.4. 하위 페이지는 풀다운 새로고침과 풀업 로딩에 적합합니다.
이전에는 대규모 풀다운 새로고침을 할 때 새로운 페이지 형태를 사용했습니다. 튜토리얼, 어떻게 해봐도 실패했어요 나중에 보세요. 소스코드를 읽어보니 풀다운 새로고침이 반드시 서브페이지 형태여야 한다는 걸 알았습니다.즉, your list.html 아래로 당겨서 새로 고치려면 index.html의 하위 페이지여야 합니다.
5. 새 페이지는 새 페이지에 적합합니다.
새 페이지를 열어야 하는 경우 세부 정보 등을 보는 데 적합합니다. 그리고 mui 자체가 새 페이지의 back 메서드를 캡슐화합니다. , 걱정할 필요가 없습니다.6. 페이지를 미리 로드하는 두 가지 방법
첫 번째는 초기화 시 미리 로드하는 것이고, 오랜만에 이 페이지를 사용하기에 적합한 상황입니다. 바로 페이지에 도착하여 사용하고 싶다면 , 그러면 null을 얻게 됩니다.두 번째 방법은 open과 비슷합니다.
개인적으로는 별 차이가 없습니다. open이 직접 여는 것만 다르고, preload는 로딩일 뿐이고, 나중에 여는 시간을 선택할 수 있습니다.7. 요약
새 페이지를 열어야 하는 경우 하위 페이지를 사용하세요. 필요한 경우 새 페이지 방법을 사용하세요. 페이지를 로드하고 일시적으로 사용하지 않으려면 사전 로드 방법을 사용하세요. 이 기사의 사례를 읽은 후 방법을 마스터했다고 생각합니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요!추천 자료:
재생, 일시 정지, 진행 드래그, 볼륨 조절 및 전체 화면이 가능한 H5 플레이어의 맞춤형 구현
H5에서 조각난 이미지 전환을 만드는 방법위 내용은 Mui 페이지 점프 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!