标签:color demo 图片上传 需要 rip 本地 view 基础 tab
<!-- 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")
<!-- 5、 uni-app 头部及底部导航设置 -->
https://www.cnblogs.com/xiaoyaolang/p/13968907.html
<!-- 6、 uni-app 基础格式,仅供参考-->
https://www.cnblogs.com/xiaoyaolang/p/13644720.html
<!-- 7、Eapp 调接口 -->
https://www.cnblogs.com/xiaoyaolang/p/13646138.html
(1) 当前页的各种方法事件都写在 methods: {} 中
(2) created() {}, 中的事件 首次进入执行一次
(3) onShow() {}, 中的事件 进入页面就执行
<!-- 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>
标签:color demo 图片上传 需要 rip 本地 view 基础 tab
原文地址:https://www.cnblogs.com/xiaoyaolang/p/14478706.html