>  기사  >  웹 프론트엔드  >  WeChat 미니 프로그램 템플릿 및 모듈 사용 정보(자세한 튜토리얼)

WeChat 미니 프로그램 템플릿 및 모듈 사용 정보(자세한 튜토리얼)

亚连
亚连원래의
2018-06-23 18:04:281646검색

이 글은 주로 위챗 미니 프로그램 템플릿과 모듈 사용법을 소개하고, 위챗 미니 프로그램의 템플릿과 모듈 개념, 간단한 사용법을 예시 형태로 분석해 도움이 필요한 친구들이 참고할 수 있습니다

이 글은 그 예를 알려드립니다. WeChat 미니 프로그램 프로그램 템플릿 및 모듈식 사용. 참조를 위해 모든 사람과 공유하세요. 세부 사항은 다음과 같습니다.

template

Template, 다음 선언 방법과 같이 정의할 때 name 속성을 사용하세요.

<template name="mytemp">
 <view>
  name:{{names}} address:{{add}}
 </view>
</template>

템플릿은 인터페이스에 직접 표시할 수 없습니다. , 호출해야 할 때만 표시될 수 있습니다. 호출할 때 is 속성을 사용하여 어떤 템플릿이 호출되고 있는지 표시해야 하며 매개변수를 전달하는 방법은 다양합니다

<!-- 直接给模板里面用到的字段赋值 -->
<template is="mytemp" data="{{names:&#39;aaa&#39;, add:&#39;bbbb&#39;}}"></template>
<!-- 通过给模板赋值对象来调用-->
<template is="mytemp" data="{{...person}}"></template>
<!-- 通过给模板赋值数组里面的对象来调用-->
<template is="mytemp" data="{{...persons[0]}}"></template>
<template is="mytemp" data="{{...persons[1]}}"></template>

Modular

다음을 수행할 수 있습니다. 일부 공통 코드를 별도의 js 파일로 추출하여 모듈로 사용하면 수출과 요구가 함께 사용되어야 한다고 설명하고 있습니다. require 사용법에 대해 설명하는 영상도 있고, node.js를 로컬로 다운받아야 하는데, 사용하다가 문제가 있으면 그냥 다운받아두시면 ​​됩니다. 다음과 같이 common.js 형식을 만들었습니다.

//引用url
require("url.js");
function log(str){
 console.log("log:" + str);
}
//暴露log方法
 module.exports.log = log;

다음과 같은 방법으로 사용할 수 있습니다.

var common = require("../../common/common.js");
Page({
 click:function(){
  common.log("输出消息");
 }
})

위 내용은 모든 사람을 위해 정리한 내용입니다. 앞으로 모든 사람에게 도움이 되기를 바랍니다.

관련 기사:

JS에서 첫 번째 화면이 아닌 이미지의 지연 로딩을 구현하는 방법

JavaScript를 사용하여 기생 결합 상속을 구현하는 방법

js 코드를 사용하여 복사 기능을 구현하는 방법

tangram.js 사용 라이브러리는 어떻게 js 클래스를 구현합니까

위 내용은 WeChat 미니 프로그램 템플릿 및 모듈 사용 정보(자세한 튜토리얼)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.