uni-app跨域的解决以及如何封住api，请求接口

let request = function(url, data = {}, method = "GET") {return new Promise((resolve, reject) => {uni.showLoading({title: "加载中",mask: true,});uni.request({url, //真实接口地址。data, //参数method, //请求的方式header: {'token':uni.getStorageSync("token")},// 成功使用resolvesuccess: (res) => {resolve(res)},//失败调用rejectfail: (err) => {reject(err)},});setTimeout(function() {uni.hideLoading();}, 2000);})}module.exports = {request,
}

配置 vue.config.js

module.exports = {devServer: {//设置代理proxy: {'/api' : {target: "http://ceshi2.dishait.cn/api/v1",//域名changeOrigin: true,//开启代理pathRewrite: {'^/api' : '/'}}}}
};

async tabs() {let {data: tab} = await request("/api/postclass")console.log(tab)for (let i = 0; i < tab.data.list.length; i++) {this.tab.push(tab.data.list[i].classname)}},

uni-app打包方法

1.在项目目录下的manifest.json里配置：

2.在发行中打开云打包：

3.选择需要打包的类型：

4.选择证书：这个公司会花钱买的

5.是否需要安装渠道：

6.原生混淆、广告联盟和换量联盟：

uniapp怎么进行路由跳转

uni.navigateTo(OBJECT) 保留当前页面，跳转到应用内的某个页面，使用uni.navigateBack可以返回到原页面。

uni.redirectTo(OBJECT) 关闭当前页面，跳转到应用内的某个页面。

uni.reLaunch(OBJECT) 关闭所有页面，打开到应用内的某个页面。

uni.switchTab(OBJECT) 跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面。

uni.navigateBack(OBJECT) 关闭当前页面，返回上一页面或多级页面。

uni.preloadPage(OBJECT) 预加载页面，是一种性能优化技术。被预载的页面，在打开时速度更快。

案例：

uni.navigateTo({url: `../details/details?details=${details}`,})
},

官方文档(https://uniapp.dcloud.io/api/router?id=navigateto)

怎么配置tabbar

在pages.json中配置
color-默认字体颜色
selectedColor-选中的字体颜色
backgroundColor-tabbar的背景颜色
pagePath-路由 iconPath-未选中的icon
selectedIconPath-选中的icon

"tabBar": {"color": "#8A8A8A","selectedColor": "#1698DB","borderStyle": "black","backgroundColor": "#FFFFFF","list": [{"pagePath": "pages/index/index","text": "首页","iconPath": "static/shequ.png","selectedIconPath": "static/shequs.png"},{"pagePath": "pages/dynamic/dynamic","text": "动态","iconPath": "static/dongtailan.png","selectedIconPath": "static/dongtailans.png"},{"pagePath": "pages/information/information","text": "消息","iconPath": "static/xiaoxi.png","selectedIconPath": "static/xiaoxis.png"},{"pagePath": "pages/user/user","text": "我的","iconPath": "static/wode.png","selectedIconPath": "static/wodes.png"}]}

如何使用组件

 // 常用组件，全局注册import tsBad from 'components/teaset/components/ts-badge.vue';

 // 全局注册Vue.component("ts-bad",tsBad)

<ts-bad></ts-bad>

局部组件设置vue文件下

   <script>// 组件局部注册import tsBann from "components/teaset/components/ts-banner.vue"export default {components:{tsBann},data() {return {title: 'index',list: []}},onLoad() {},methods: {}}</script>

基础语法是什么

计算属性

computed:{ 属性名:function(){ return 返回值; }}<template><view class="demo"><view>{{message}}</view><view>{{reversedMessage}}</view> </view>
</template>

在computed中写上计算属性

<script>
export default {data() {return {message: 'uniapp'}},computed:{//计算属性的 getterreversedMessage: function() {return this.message.split('').reverse().join('')   //字符串反转}}
}
</script>

监听属性

<view><text>{{mag}}</text>
</view>
<button type="primary" @tap="add">add</button>
data:{mag：0
},
methods: {add(){this.mag=this.mag+1;}
},
watch:{mag:function(new,old){console.log("watch",this.mag)}
}

列表渲染 v-for

<view><view v-for="(item,index) in students">{{index}}-{{item.name}}:{{item.age}}</view>
</view>
data(){return{students:[{name:"zhangsan",age:18},{name:"lisi",age:20}]}}

条件渲染 v-if

<view><view v-if="test">test...</view>
</view>
data(){return{test:true}
}

v-hideen:显示或隐藏

<view><view :hidden="test">test...</view>
</view>
data(){return{test:true}
}

事件及事件绑定

click:'tap',   //被点击
touchstart:'touchstart',   //当手指开始在元素上触屏的时候
touchmove:'touchmove', //移动的时候
touchcancel:'touchcantel',//取消的时候
touchend:'touchend',//结束的时候
tap:'tap',//点击的时候
longtap:'longtap',//长按
input:'input',//输入
change:'change',//改变
submit:'submit',//表针对于单提交
blur:'blur',//失焦
focus:'focus',//聚焦
reset:'reset',//表单重置
confirm:'confirm',//确认
columnchange:'columnchange',//字段变化
linechange:'linechange',//行变化
error:'error',//错误
scrolltoupper:'scrolltoupper',//滚动元素滚动到顶部
scrolltolower:'scrolltolower',//滚动到到最小
scroll:'scroll',//滚动的时候

生命周期都有哪些

<script>
export default {//应用初始化完成触发一次，全局只触发一次onLaunch:function() {console.log("App Launch")},//应用启动的时候，或者从后台进入前台会触发onShow:function() {console.log("App Show")},//应用从前台进入后台触发onHide:function(){console.log('App Hide')},//监听页面加载onLoad(){console.log('page onLoad')},//监听页面的初次渲染完成onReady(){//TODO 如果渲染速度快，会在页面进入动画完成前触发console.log('page onReady')},//监听页面显示onShow() {console.log('page onShow')},//监听页面隐藏onHide() {console.log('page onHide')},//监听页面卸载onUnload(){console.log('page onUnload')},methods:{open(){uni.navigateTo({url:'../demo/demo'})}}}
</script>

uniapp中 nvue是什么？描述一下他的特点

uni-app是逻辑和渲染分离的，渲染层在app端提供了两套排版引擎。

小程序方式的webview渲染，和weex方式的原生渲染，两种渲染引擎可以自己根据需要选。
vue文件走的webview渲染
nvue走weex方式的原生渲染

组件和js写法是一样的，css不一样，原生排版的能用的css必须是flex布局
uni-app的App端内置了一个基于weex改进的原生渲染引擎，提供了原生渲染能力。在App端，如果使用vue页面，则使用webview渲染；如果使用nvue页面(native vue的缩写)，则使用原生渲染。一个App中可以同时使用两种页面，比如首页使用nvue，二级页使用vue页面，hello
uni-app示例就是如此。

虽然nvue也可以多端编译，输出H5和小程序，但nvue的css写法受限，所以如果你不开发App，那么不需要使用nvue。

nvue 和 vue 相互通讯在 uni-app 中，nvue 和 vue 页面可以混搭使用。

如何进行存储数据，获取数据

uni.setStorage(OBJECT) 将数据存储在本地缓存中指定的 key 中，会覆盖掉原来该 key 对应的内容，这是一个异步接口。

uni.setStorageSync(KEY,DATA)将 data 存储在本地缓存中指定的 key 中，会覆盖掉原来该key对应的内容，这是一个同步接口。

uni.getStorage(OBJECT) 从本地缓存中异步获取指定 key 对应的内容。

uni.getStorageSync(KEY) 从本地缓存中同步获取指定 key 对应的内容。

uni.getStorageInfo(OBJECT)异步获取当前 storage 的相关信息。

uni.getStorageInfoSync() 同步获取当前 storage 的相关信息。

uni.removeStorage(OBJECT) 从本地缓存中异步移除指定 key。

uni.removeStorageSync(KEY)从本地缓存中同步移除指定 key。

uni.clearStorage()清理本地数据缓存。

uni.clearStorageSync()同步清理本地数据缓存。

官方文档 https://uniapp.dcloud.io/api/storage/storage?id=setstorage

css像素单位使用什么最合适

开发者可以根据设计稿的基准宽度来计算页面元素的rpx值，设计稿的1px 与框架样式 1rpx 转换公式如下：

设计稿 1px / 设计稿基准宽度 = 框架样式 1rpx / 750rpx
所以，在实际开发中，1 rpx = 750 * （设计稿宽度 / 设计稿基准宽度）

很好理解，比如：
1、设计稿的基准宽度为 750px, 有一个红色方块宽度为100px，换算成rpx 结果为：100rpx ，也就是说 1rpx = 1px
750 * 100 / 750

2、设计稿为640px，红色方框宽度为100px，换算成rpx结果为：117rpx
750 * 100 / 640

注意：
（1）rpx是宽度相关的单位，屏幕越宽，元素会越大，如果不想随着屏幕宽度缩放，请使用px 。

（2）字体或者高度使用了rpx ，那么需注意这样的写法意味着随着屏幕变宽，字体会变大、高度会变大。

（3）rpx不支持横屏切换，如果使用rpx 建议锁定屏幕方向。

（4）早期uni-app推荐使用upx，目前官方已经推荐统一改为rpx了。