程序员根本没有35岁的危机! ! !
周末没出去,又点了一份。有网友让我用Node+vue做商城系统。
其实在web开发中,很多语言的后台逻辑处理都是一样的。学好一种语言可以扫过其他语言。所以学习任何语言都有未来。
这份清单是我原来的月薪!
编程行业是一个有争议的行业:
高薪,996、秃顶,格子衬衫……
这些都是外界给程序员的帽子。
我是一名开发多年的程序员。从本科到硕士一直在重试计算机相关的工作,基本见证了这个行业的风风雨雨。
其实,外界的声音并不重要,关键是做你自己!今年与您的同行交流:
35岁有职业危机吗!
从我的职场经历来看,35岁没有危机感,反而越来越火,工资也越来越高!
什么样的程序员容易被淘汰???
停滞不前,从不学习商城小程序开发,35岁还是个CRUD(CRUD)!如果你说不,你会解雇谁?
35岁的我们当然在学习能力和加班方面都比不上应届毕业生。
但您可以在技术和管理方面建立优势。当然 开发小程序 ,你也可以发展兼职工作。兼职可以做什么? ?
咨询、私下工作、自媒体等
其中任何一项都可能超过您的薪水。我曾经咨询过一家公司,给出了五个数字。托布真香!上次和一个朋友吃饭的时候,他是一个本科生,一直在做 NLP。他上周去大学补课商城小程序开发,早上给了4500。
所以35岁还年轻。对于程序员来说,转型的方向太多了。我觉得程序员35岁就失业了。P字! ! !
我们来看看开发的系统。
一、系统界面
二、系统核心代码展示
// 小孟v:jishulearn
<template>
<view class="cart">
<!--<view class="header" :style="{ position: headerPosition, top: headerTop }">-->
<!--<view class="title">购物车</view>-->
<!--</view>-->
<!--<!– 占位 –>-->
<!--<view class="place"></view>-->
<!-- 购物车为空 -->
<view v-if="cartList.length === 0" class="empty">
<text class="iconfont icongouwuche" :class="'text-'+themeColor.name"></text>
<view v-if="hasLogin" class="empty-tips">
空空如也
<navigator
class="navigator"
:class="'text-'+themeColor.name"
v-if="hasLogin"
url="../category/category"
open-type="switchTab"
>随便逛逛></navigator
>
</view>
<view v-else class="empty-tips">
空空如也
<view class="navigator" :class="'text-'+themeColor.name" @tap="navTo('/pages/public/logintype')"
>登录/注册 ></view
>
</view>
</view>
<!-- 购物车列表 -->
<view class="goods-list" v-else>
<view class="rf-cart-row" v-for="(row, index) in cartList" :key="index">
<!-- 删除按钮 -->
<view class="menu" @tap.stop="deleteCartItem(row.id, 'one')" :class="'bg-'+themeColor.name">
<text class="iconfont icon iconiconfontshanchu1"></text>
</view>
<!-- 商品 -->
<view
class="carrier"
:class="[
theIndex === index ? 'open' : oldIndex === index ? 'close' : ''
]"
@touchstart="touchStart(index, $event)"
@touchmove="touchMove(index, $event)"
@touchend="touchEnd(index, $event)"
>
<!-- checkbox -->
<view class="checkbox-box" @tap="selected(index, row)">
<view
class="checkbox"
:class="[
parseInt(row.status, 10) === 0 ? `checkbox-disabled ${'text-'+themeColor.name}` : 'text-'+themeColor.name
]"
>
<view :class="[row.selected ? `on ${'bg-'+themeColor.name}` : '']"></view>
</view>
</view>
<!-- 商品信息 -->
<view class="goods-info">
<view class="img">
<image :src="row.productPic"></image>
</view>
<view class="info">
<view
class="title in2line"
@tap="navTo(`/pages/product/product?id=${row.product.id}`)"
>
{{ row.productName }}
</view>
<view class="state-wrapper">
<view class="spec" @tap.stop="toggleSpec(row)">{{ row.productAttr|attrFilter}}</view>
<view class="state" v-if="parseInt(row.status, 10) === 0">
已失效
</view>
</view>
<view class="price-number">
<view class="price">{{ moneySymbol }}{{
row.price
}}</view>
<view class="remark" >{{ row.remark }}</view>
<view class="number" >
<view class="sub" @tap.stop="sub(row, index)">
<text class="iconfont icon icon-jianhao"></text>
</view>
<view class="input" @tap.stop="discard">
<input
type="number"
:class="'text-'+themeColor.name"
v-model="row.quantity"
@input.stop="numberChange(row, $event, index)"
/>
</view>
<view class="add" @tap.stop="add(row, index)">
<text class="iconfont icon iconjia1"></text>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
<!-- 脚部菜单 -->
<view
class="footer"
:style="{ bottom: footerbottom }"
v-if="cartList.length !== 0"
>
<view class="checkbox-box" @tap="allSelect">
<view class="checkbox" :class="'text-'+themeColor.name">
<view :class="[isAllselected ? `on ${'bg-'+themeColor.name}` : '']"></view>
</view>
<view class="text">全选</view>
</view>
<view
class="delBtn"
:class="'text-'+themeColor.name"
@tap="deleteCartItem"
v-if="selectedList.length > 0"
>删除</view
>
<view class="settlement">
<view class="sum"
>合计:
<view class="money">{{ moneySymbol }}{{ sumPrice }}</view>
</view>
<view class="btn" :class="'bg-'+themeColor.name" @tap="createOrder"
>结算({{ selectedList.length }})</view
>
</view>
</view>
<!-- 规格-模态层弹窗 -->
<view
class="popup spec show"
v-if="specClass === 'show'"
@touchmove.stop.prevent="stopPrevent"
@tap="hideSpec"
>
<!-- 遮罩层 -->
<view class="mask" @tap="hideSpec"></view>
<view class="layer" @tap.stop="stopPrevent">
<rf-attr-content
:isSelectedNum="false"
:product="productDetail"
@toggle="toggleSpec"
></rf-attr-content>
</view>
</view>
<!--页面加载动画-->
<rfLoading isFullScreen :active="loading"></rfLoading>
</view>
</template>
<script>
import {
cartItemClear,
cartItemDel,
cartItemList,
cartItemUpdateNum,
cartItemUpdateSku,
productDetail
} from '@/api/product';
import rfAttrContent from '@/components/rf-attr-content';
import { mapMutations } from 'vuex';
export default {
components: { rfAttrContent },
filters:{
attrFilter(val){
if(!val) return ;
val = JSON.parse(val);
let res = [];
val.map(v=>{
res.push(v.value);
})
return res.join(',');
}
},
data() {
return {
sumPrice: '0.00',
headerPosition: 'fixed',
headerTop: null,
statusTop: null,
showHeader: true,
selectedList: [],
isAllselected: false,
// 控制滑动效果
theIndex: null,
oldIndex: null,
isStop: false,
cartList: [],
hasLogin: null,
footerbottom: 0,
specClass: 'none',
productDetail: {
base_attribute_format: [],
sku: []
},
specSelected: [],
specChildList: [],
specList: [],
currentSkuId: '',
moneySymbol: this.moneySymbol,
loading: true,
singleSkuText: this.singleSkuText
};
},
onPageScroll(e) {
// 兼容iOS端下拉时顶部漂移
this.headerPosition = e.scrollTop >= 0 ? 'fixed' : 'absolute';
this.headerTop = e.scrollTop >= 0 ? null : 0;
this.statusTop = e.scrollTop >= 0 ? null : -this.statusHeight + 'px';
},
// 下拉刷新,需要自己在page.json文件中配置开启页面下拉刷新 "enablePullDownRefresh": true
onPullDownRefresh() {
this.selectedList.length = 0;
this.isAllselected = false;
this.sumPrice = 0;
this.getCartItemList('refresh');
},
onShow() {
// 兼容H5下结算条位置
// #ifdef H5
this.footerbottom =
document.getElementsByTagName('uni-tabbar')[0].offsetHeight + 'px';
// #endif
// #ifdef APP-PLUS
this.showHeader = false;
// eslint-disable-next-line
this.statusHeight = plus.navigator.getStatusbarHeight();
// #endif
this.initData();
},
methods: {
...mapMutations(['setCartNum']),
// 规格弹窗开关
toggleSpec(row) {
if (parseInt(row.status, 10) === 0) return;
if (this.specClass === 'show') {
if (!this.hasLogin) {
this.specClass = 'none';
this.$mHelper.toast('请先登录!');
return;
}
this.handleCartItemUpdateSku(this.currentSkuId, row.skuId);
this.specClass = 'hide';
setTimeout(() => {
this.specClass = 'none';
}, 250);
} else if (this.specClass === 'none') {
if (row) {
this.getProductDetail(row);
}
}
},
// 获取产品详情
async getProductDetail(row) {
this.currentSkuId = row.sku_id;
await this.$http
.get(`${productDetail}`, {
id: row.product_id
})
.then(async r => {
this.productDetail = r.data;
this.productDetail.sku_name = row.sku_name;
this.specClass = 'show';
});
},
hideSpec() {
this.specClass = 'hide';
setTimeout(() => {
this.specClass = 'none';
}, 250);
},
stopPrevent() {},
// 删除选中购物车商品
async deleteCartItem(id, type) {
let ids = [];
for (let i = 0; i < this.cartList.length; i++) {
if (this.cartList[i].selected) {
ids.push(parseInt(this.cartList[i].id, 10));
}
}
await this.$http2.post("cart/delete",{ids},{
header:{
'content-type':'application/x-www-form-urlencoded'
}
});
this.selectedList.length = 0;
this.isAllselected = false;
this.sumPrice = 0;
this.getCartItemList();
this.oldIndex = null;
this.theIndex = null;
// await this.$http
// .post(`${cartItemDel}`, {
// sku_ids: JSON.stringify(skuIds)
// })
// .then(() => {
// this.selectedList.length = 0;
// this.isAllselected = false;
// this.sumPrice = 0;
// this.getCartItemList();
// this.oldIndex = null;
// this.theIndex = null;
// });
},
// 修改购物车商品sku
async handleCartItemUpdateSku(skuId, newSkuId) {
await this.$http
.post(`${cartItemUpdateSku}`, {
sku_id: skuId,
new_sku_id: newSkuId
})
.then(() => {
this.selectedList.length = 0;
this.isAllselected = false;
this.sumPrice = 0;
this.getCartItemList();
});
},
// 数据初始化
initData() {
this.hasLogin = this.$mStore.getters.hasLogin;
if (this.hasLogin) {
this.theIndex = null;
this.oldIndex = null;
this.selectedList.length = 0;
this.isAllselected = false;
this.sumPrice = 0;
this.getCartItemList();
} else {
this.cartList = [];
this.selectedList.length = 0;
this.loading = false;
}
},
// 通用跳转
navTo(route) {
if (!this.$mStore.getters.hasLogin) {
uni.setStorageSync('backToPage', JSON.stringify({ route: '/pages/cart/cart' }));
}
this.$mRouter.push({ route });
},
// 获取购物车列表
async getCartItemList(type) {
let r = await this.$http2.get('cart/list').catch(() => {
this.cartList = [];
this.loading = false;
if (type === 'refresh') {
uni.stopPullDownRefresh();
}
});
this.loading = false;
this.cartList = r.data;
this.$set(this,'cartList',[...r.data]);
// 清空购物车
clearCart(params) {
const content = params ? '清空失效商品?' : '清空购物车?';
uni.showModal({
content,
success: async e => {
if (e.confirm) {
await this.$http.post(`${cartItemClear}`, params).then(() => {
this.selectedList.length = 0;
this.isAllselected = false;
this.sumPrice = 0;
this.getCartItemList();
});
}
}
});
},
// 控制左滑删除效果
touchStart(index, event) {
// 多点触控不触发
if (event.touches.length > 1) {
this.isStop = true;
return;
}
this.oldIndex = this.theIndex;
this.theIndex = null;
// 初始坐标
this.initXY = [event.touches[0].pageX, event.touches[0].pageY];
},
三,欢迎关注我
如果你想了解更多技术 小程序定制 ,欢迎关注我!
大家好,我是小萌,10年资深开发者,小作坊老板,码农商城小程序开发,主管,产品经理。喜欢自由,讨厌职场内讧。我的偶像是史蒂夫乔布斯。 10年前,我因为热爱而选择了计算机行业。现在已经30多岁了,虽然不像当初追求技术那么简单,但他依然热爱它。科技改变世界,知识改变命运,是我不变的信念。学习、思考、与时俱进是我的武器。如果我觉得一件事值得做,至少我会坚持5年。毕业一年后,我把房贷、车贷等都拿出来了,所以我自由了。我不喜欢例行公事和安排好的生活。我喜欢在大学里辗转反侧,现在仍然如此。我大部分时间都很孤独,我喜欢独处。我不知道未来会是什么样子,但我仍然会追求充满激情的生活和事物。我相信坚持的力量。如果我能坚持一件事,我真的可以打败99%的人。关注我,聊科技、事业、生活、趣事。
发现、改变
探知、求新
共享,感恩一路相伴
昱远品牌形象已完成全面升级
点击访问新官网