文始小demo

文始前端简单介绍

<!-- 1、 uni 项目 使用 HBuilderX 打开  -->
    编辑器下载地址 ：  https://www.dcloud.io/
    
    <!-- 2、新建一个uni项目 -->
        （1）新建一个文件夹运行 ：cnpm i epii-vue-cli -g
        （2）在该文件夹运行 ： epii-vue-cli init
        （3）按照提示正常运行即可。 (安装 node_modules) （npm install -S）

    <!-- 3、文件配置  config文件夹 -->
        （1） config.base.js
                app_update_api : app更新接口
                upload_uri     ：图片上传接口
                root_page      ：跟页面（一进入app打开的页面，一般为/pages/tabs/index，（也可能有变更））
                no_login_pages ：不需要登陆的页面，（例：["/pages/root/root", ]）

        （2） config.development.js
                本地接口访问地址

        （3） config.production.js
                线上接口访问地址

    <!-- 4、几个注意事件 -->
        （1） 图片、css等静态文件放在static文件夹下。
        （2） 在pages文件夹下面创建项目所需的页面。
        （3） 创建页面后要在pages.json文件中注册。
        （3） 该项目的底部导航页面要以tabs命名。（例："pages/tabs/index"）

　app 更新接口备注  https://www.cnblogs.com/xiaoyaolang/p/14651938.html

 <!-- 5、 uni-app 头部及底部导航设置 -->

　　https://www.cnblogs.com/xiaoyaolang/p/13968907.html

<!-- 6、 uni-app 基础格式，仅供参考-->

　　https://www.cnblogs.com/xiaoyaolang/p/13644720.html

<!-- 7、Eapp 调接口 -->

        （1） 当前页的各种方法事件都写在 methods: {} 中
        （2） created() {}, 中的事件 首次进入执行一次
        （3） onShow() {}, 中的事件 进入页面就执行

　　https://www.cnblogs.com/xiaoyaolang/p/13646138.html

 <!-- 8、一个小demo -->
        <template>
            <epii-loading>
                <view style="height:1upx;"></view>
                <view class="geyixia">{{xuanran}}</view>
                <view class="geyixia" @click="dianji">这是个点击事件</view>
                <view class="geyixia">
                    <text>这是个循环</text>
                    <view v-for="(item,index) in shuzu" :key="index" >
                        <text>{{item}}</text>
                    </view>
                </view>
                <view class="geyixia" @click="getdata">获取项目组列表</view>
                <view class="geyixia" v-if="data.length">
                    这就是接口的数据
                    <view v-for="(item,index) in data">
                        <text>{{item.title}}</text>
                    </view>
                </view>
                
            </epii-loading>
        </template>
        
        <script>
        export default {
            data() {
                return {
                    xuanran:"普通的渲染数据",
                    shuzu:["刘备","关羽","张飞"],
                    data:[]
                };
            },
            created() {
                setTimeout(()=>{
                    this.show()	
                },1000)
            },
            onShow() {},
            onLoad(options) {},
            methods: {
                // 这是个点击事件
                dianji(){
                    console.log("点击了")
                },
                // 获取项目组列表 
                async getdata(){
                    try {
                        let data = await Eapp.http.loading.post('pm_project@group', {
                        });
                        this.data = data
                        this.show(); //关掉转圈儿
                        console.log(data)
                    } catch (e) {
                        // 接口错误执行的处理
                        Eapp.ui.toast.text(e);
                    }
                }
            }
        };
        </script>
        
        <style scoped lang="less">
            .geyixia{
                width:80%;
                text-align: center;
                margin:0 auto;
                background-color: pink;
                margin-top:20upx;
            }
        </style>