能 bba 就 bba

看看我这如何 https://codesandbox.io/p/sandbox/musing-feather-dyf4j5?file=%2Fsrc%2FApp.vue%3A11%2C12

v2 也有发帖员了？老是在热门看见，点了一下个人主页，好家伙，你的帖子很有“话题性”，👍👍👍👍

@zhonj 不是无脑 copy ，会选择性的删除一些用不到的属性，经常用到的是 fontSzie 、color 、border 、background ，真的很方便

react 就 taro ，另外小程序支持 ci

// 自动将代码上传到小程序
const ci = require('miniprogram-ci')
const path = require('path')
const mainfest = require('../src/manifest.json')
const slog = require('single-line-log').stdout
const robot = Number(process.env.ROBOT) || 1
const buildVersion = process.env.npm_config_build_version || mainfest.versionName

function getUploadDesc() {
// dev
if (robot === 1) {
return 'build by robot --dev'
}

// test
if (robot === 2) {
return 'build by robot --test'
}

// release
if (robot === 3) {
return 'build by robot --release'
}

// uat
if (robot === 4) {
return 'build by robot --uat'
}

return mainfest.description
}

async function main() {
const project = new ci.Project({
appid: mainfest['mp-weixin'].appid, //appid
type: 'miniProgram',
projectPath: path.resolve(__dirname, '../dist/build/mp-weixin'), //项目路径
privateKeyPath: path.resolve(__dirname, `./private.${mainfest['mp-weixin'].appid}.key`), //小程序后台的上传密匙
ignores: ['node_modules/**/*']
})

let slogIndex = 0

try {
await ci.upload({
project,
version: buildVersion,
desc: getUploadDesc(),
setting: mainfest['mp-weixin'].setting,
robot,
onProgressUpdate: () => {
slog('上传中' + (slogIndex === 0 ? '.' : slogIndex === 1 ? '..' : '...') + '\n')
slogIndex++
if (slogIndex === 3) {
slogIndex = 0
}
}
})
console.log(`上传成功 版本${buildVersion}`)
} catch (error) {
console.error(`上传失败 版本${buildVersion}`, error)
}
}

main()

@zhonj 为什么会有去维护一个类名的需求，写 vue scoped ，写 react 就 css module ，我写样式除了 @include text-ellipsis;这样的仅有的几个代码，几乎不复用

定位要么一眼就观察到了，要么 cmd+f

还有一个很重要的点，类似于蓝湖这样的工具已经能生成很多样式代码，拷贝+简单的修改就可以活，效率和心智负担比 tailwindcss 之类的玩意强太多了

```js
// 头部导航栏样式
setInnerClass(idx) {
const isBefore = idx < this.active
const isCurrent = idx === this.active
const isAfter = idx > this.active
const beforeClassInner =
'min-w-[22px] max-w-[22px] w-[22px] h-[22px] bg-[#ffffff] text-[#3F7AFF] text-center text-[12px] font-semibold leading-[18px] rounded-full border-[2px] border-[#C8D7F9]'
const currentClassInner =
'min-w-[22px] max-w-[22px] w-[22px] h-[22px] bg-[#3F7AFF] text-[#fff] text-center text-[12px] font-semibold leading-[18px] rounded-full border-[2px] border-[#124FDA]'
const afterClassInner =
'min-w-[22px] max-w-[22px] w-[22px] h-[22px] bg-[#ECECEC] text-[#CBCBCB] text-center text-[12px] font-semibold leading-[18px] rounded-full border-[2px] border-[#ECECEC]'
return (isBefore && beforeClassInner) || (isCurrent && currentClassInner) || (isAfter && afterClassInner)
},
setOuterClass(idx) {
const isBefore = idx < this.active
const isCurrent = idx === this.active
const isAfter = idx > this.active
const beforeClassWarp = 'z-[2] max-w-[26px] relative rounded-full border-[2px] border-[#C8D7F9]'
const currentClassWarp = 'z-[2] max-w-[26px] relative rounded-full border-[2px] border-[#C8D7F9]'
const afterClassWarp = 'z-[2] max-w-[26px] relative rounded-full border-[2px] border-[#ECECEC] custom-linear-box-shadow'
return (isBefore && beforeClassWarp) || (isCurrent && currentClassWarp) || (isAfter && afterClassWarp)
},
```

我不理解用 taildcss 是赶时髦还是怎么的，这种代码真的好吗？

```
<div
v-for="(group, idx) in schema"
:key="idx"
class="min-h-[70px] relative"
>
<div
:class="setOuterClass(idx)"
@click="() => {
active = idx
}">
<div :class="setInnerClass(idx)">
<div>{{ idx + 1 }}</div>
</div>
</div>
<div class="absolute text-[12px] left-[50%] top-[32px] min-w-[70px] translate-x-[-35px] text-center" :style="{ color: active >= idx ? '#3F7AFF' : '#CBCBCB'}">{{ group.label }}</div>
</div>
```

之前一个同事用了 tailwindcss ，UI 设计的花哨点，样式代码比标签长
我去改样式，p-8 、f12 都是什么鬼，还要一个个的去看

没有成熟的设计规范，tailwindcss 请自己玩玩就好

原因： https://cn.vuejs.org/api/composition-api-setup.html#accessing-props

props 直接使用，不要再 ref 一遍

分母罢了

第一次见，禁用 css 可以加载网页，并且你这个问题是在窗口宽度小于 768 时出现，大概率定位到媒体查询里面的代码出现问题，控制变量法，style.css 和 aoyun.css 这个文件，@media (min-width:768px)里面一块块的注释，定位出具体的地方，记得来分享哦 https://i.v2ex.co/504J5BO2.png

两个 css 校验错误：
304 .mcArchiveNav 属性 backdrop-filter 不存在 : saturate(130%) blur(20px)
619 .picBox img 无效数字 : height 太多值不能识别 : intrinsic

eladmin 上套的吧，说一下这个模版的通病：
1 、列表进详情，返回后又回到第一页（一堆检索条件，第十页，详情，返回，第一页并且检索条件没留住）
2 、菜单管理，上级菜单不能是自己或者自己的子集，这个问题曾经直接干崩过一个系统，不知道现在的版本修复了没有

作者可以改进一下

文笔不错，看着很有意思

看出来是用心做了的，挺佩服楼主能找到那么多图片，我以前也搞过博客，找配图比内容本身花的时间都长！
详情页面（ https://nexmoe.com/3701269205.html ）的媒体查询断点可以优化一下，特定宽度最右侧的导航会被挡住。翻了一下后面几页，我个人觉得内容深度需要提高。