wepy.app、wepy.page、wepy.component的区别

wepy.app 只会用到一次,就是在App.wpy里面,

入口app.wpy继承自wepy.app,包含一个config属性和其全局属性、方法、事件。

其中config属性对应原有的app.json,编译时会根据config生成app.json文件

<style type="less">
/** less **/
</style>
<script>
import wepy from 'wepy';
wepy.app({
    config = {
            "pages":[
            "pages/index/index"
        ],
        "window":{
            "backgroundTextStyle": "light",
            "navigationBarBackgroundColor": "#fff",
            "navigationBarTitleText": "WeChat",
            "navigationBarTextStyle": "black"
        }
    };
    onLaunch() {
        console.log(this);
    }
});
</script>

wepy.page是负责来创建页面的,

页面入口继承自wepy.page

<style type="less">
/** less **/
</style>
<template type="wxml">
    <view>
    </view>
    <component id="counter1" path="counter"></component>
</template>
<script>
import wepy form 'wepy';
import Counter from '../components/counter';
wepy.page({

    config = {};
    components = {counter1: Counter};

    data = {};
    methods = {};

    events = {};
    onLoad() {};
    // Other properties
});
</script>

wepy.page属性说明

wepy.component是负责创建组件的,

页面入口继承自wepy.component,属性与页面属性一样,除了不需要config以及页面特有的一些小程序事件等等。

<style type="less">
/** less **/
</style>
<template type="wxml">
    <view>  </view>
</template>
<script>
import wepy form 'wepy';
wepy.component({

    components = {};

    data = {};
    methods = {};

    events = {};
    // Other properties
});
</script>

原创声明,本文系作者授权云+社区发表,未经许可,不得转载。

如有侵权,请联系 yunjia_community@tencent.com 删除。

编辑于

我来说两句

0 条评论
登录 后参与评论

扫码关注云+社区

领取腾讯云代金券