发布时间:2024-02-12 19:30
源码太多,放github上了点击
module.exports = {
dbProduct: mongoose.model('runoob',mongoSchema,'product'),
dbRotation: mongoose.model('runoob',mongoSchema,'rotation'),
dbUsers:mongoose.model('runoob',mongoSchema,'users'),
};
// 创建发送邮件对象
let transporter=nodemailer.createTransport({
service:'qq',
secure: true,
auth:{
user:'XXX@qq.com', // QQ邮箱
pass:'XXXXXXX', // 授权码
},
})
this.$route.meta.title;
<template>
<div class="my-tabbar">
<my-tabbar :list="list" selectedColor="#f00"></my-tabbar>
</div>
</template>
<script>
/***************************/
/* 应用中各页面复用的tabbar */
/***************************/
import routes from '@/router/router' // 从router中获取信息
export default {
name: 'app-tab-bar',
computed:{
list(){
return routes.filter(route=>route.meta?.inTabbar).map(item=>({ // 循环遍历拿到信息
pagePath: item.path,
text: item.meta.title,
icon: item.meta.icon,
}))
},
},
}
</script>
<style lang="less">
</style>
:class="['tab-bar-item', isActive && 'router-link-active', isExactActive && 'router-link-exact-active']"
只有isActive,isExactActive为真才会有属性router-link-active,router-link-exact-active也就是渲染样式
// 全局前置路由守卫,实现页面拦截
router.beforeEach((to,from,next)=>{
if(to.meta?.permission){ // 在登录后才能访问的路由中有meta={permission:true}
if(store.state.shoppingCart.token){
next()
}else{
next('/login')
}
}else{
next()
}
})
namespaced: true, // 命名空间(名字空间)
export default new Vuex.Store({
strict: process.env.NODE_ENV !== 'production', // 启用严格模式,保证在mutation中更改数据
modules: {
shoppingCart, //shoppingCart 是这个模块命名空间
},
plugins: [createPersistedState({
storage: sessionStorage, // 默认是向 localStorage 中保存数据
paths:[
'shoppingCart.token',
'shoppingCart.name',
],
})],
})
import { mapActions,mapGetters } from 'vuex' // 引入映射
export default {
name:'cart',
computed:{
carts(){
return this.$store.state.shoppingCart.carts
},
...mapGetters('shoppingCart',['allChecked','allMoney']), // 前面加入模块名shoppingCart
},
methods:{
...mapActions('shoppingCart',['removeCart','changNumCart','changCheckedSingle','changCheckedAll']),
// 前面加入模块名shoppingCart
onSubmit(){
console.log("提交订单");
},
onClickEditAddress(){
console.log('修改地址');
},
},
}
created(){
this.$router.push({
name:'sub',
params:{
name:this.navList[0],
},
})
},
也就是在分类页面加载好后即向子路由发送网络请求拿到第一个分类商品中的数据
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
npm install postcss@8.2.6 --save
npm install postcss-import@14.0.0 --save
npm install postcss-loader@5.0.0 --save
npm install postcss-pxtorem@5.1.1 --save
npm install postcss-url@10.1.1 --save
module.exports = {
plugins: {
'postcss-pxtorem': {
rootValue: 32, //根目录的字体大小设为32px
propList: ['*'], //proplist:是那些属性需要转换成rem,全部
minPixelValue: 2 //最小转换单位.2px
}
}
};
<script>(function () {
function autoRootFontSize() {
document.documentElement.style.fontSize = Math.min(screen.width, document.documentElement
.getBoundingClientRect().width) / 470 * 32 + 'px';
// 取screen.width和document.documentElement.getBoundingClientRect().width的最小值;
// 除以470,乘以32;意思就是相对于470大小的32px;
}
window.addEventListener('resize', autoRootFontSize);
autoRootFontSize();
})();</script>
注:设计师制作的效果图常为750px,为了方便直接读取UI标好的像素大小,根目录的字体大小就设置为32px;
配置应用图标
点击 发行 => 原生App-云打包
如果没有账号的话,需要先注册个账号(邮箱和电话必须验证)
打包配置
如果打包出现要实名认证可以取消通讯录
打包成功
点击地址下载
Vant 3 - 有赞出品的开源移动UI组件库,基于 Vue3 重构发布
C语言常见库函数详解——【字符/字符串函数及内存操作函数】(一)
HarmonyOS怎么样,华为EMUI正式更名为HarmonyOS,鸿蒙能成为全球第三大操作系统?...
Opencv 与 Tesseract-OCR 中文识别与训练字库学习心得
python网页爬虫漫画案例_Python爬虫 JS 案例讲解:爬取漫画
php vue rbac,Vue+ThinkPHP5.1 实现基于角色控制权限的前后端分离后台管理系统
Hive/MaxCompute SQL性能优化(一):什么是数据倾斜