이벤트 인스턴스를 구성 요소에 바인딩하는 Cpage.js에 대한 자세한 설명

Cpage.js는 TypeScript(JavaScript의 상위 집합)를 사용하여 개발된 경량 Mvvm 프레임워크입니다. 이번 글을 통해 Cpage.js 이벤트를 컴포넌트에 바인딩하는 구현 코드를 공유하겠습니다. 필요하신 분들은 참고하시면 됩니다

Cpage.js는 TypeScript(JavaScript의 상위 집합)를 사용하여 개발된 경량 Mvvm 프레임워크입니다.

내장 템플릿 엔진, 라우팅, 지침, http, dom 및 기타 모듈. 구성 요소 개발을 쉽게 수행할 수 있고 구문이 통일되어 사용하기 쉽고 타사 프레임워크에 의존하지 않으며 중소 규모 프로젝트 개발에 적합합니다.

Cpage.js는 이벤트를 일반 요소뿐만 아니라 구성 요소에도 바인딩할 수 있습니다!

먼저 컴포넌트 헤더를 정의할 수 있습니다

var header = Cpage.component({
  name: 'header',
  components: [],
  template: `<p>{{header}}--{{height}}</p>`,
  data: {
    header: &#39;this is header&#39;
  },
  props: {
    height: {
      default: &#39;10&#39;
    }
  },
  beforeRender() {
  },
  render() {
  }
});

를 사용하고 필요할 때마다 참조할 수 있습니다

<p>
  <p class="main" c-click="handelIf()">my app--templateId</p>
  <p c-if="{{ifTest}}">
    <article></article>
  </p>
   <header 
    height="{{headerHeight}}"
    c-click="headerClick()"
    ></header>
   <article></article> 
  <footer></footer> 
</p>

컴포넌트에서 c-event를 사용하여 이벤트를 바인딩할 수 있습니다

위 내용은 이벤트 인스턴스를 구성 요소에 바인딩하는 Cpage.js에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!