Zwwxd666的博客

所有模块的vuex文件堆在一起太难看了拆成多个，所有项目都这么做vue2版本的vuex脚手架搭建。

明明都设置了align item为center了。

1.安装依赖2.根目录下初始化配置文件tailwind.config.js3.tailwind.config.js配置文件内容purge是最后打包的时候扫描src下的所有vue，js结尾文件，如果没有用到的css将清理，压缩大小postcssplugins。

/

服务器先安装宝塔安装后输入bt 14查看内网链接打开宝塔页面。

大概是说如果该标签不是最顶层的，而是组件或者标签嵌套的，弹出来的drawer会被父标签的其他元素覆盖。而加了这个可能类似堆汉堡包一样给他盖到最顶上了。

静态路由表constantRoutes 添加了个404页面然后一刷新，由于getRouter获取路由及其router.addRoutes非常乌龟行为，还带一点异步的赶脚导致addRoutes 没搞完，此时动态路由表还没你要跳转路径的路由就被迫只能跳到path:* redirect=>到path:/404页面了说人话就是，路由等不及了，你后端给我的路由表太慢我就将就着跳到*任意地址的路由去。

v-show绑定loading，该数据可以放vuex还是任一的公共状态管理变量区域。然后App应用这个组件，Z index拉最大，防止用户在加载动画时乱点，封装一个组件，放Img，伪类样式，固定在屏幕fixed。//组件交互相关的代码(数据、方法等等)

在v-for遍历数据时想要通过给img的src单向绑定 图片路径时出现问题。上网查说是webpack构建时识别不到，直接不单绑数据，写死试试看。直接require导入图像文件模块。

router路由为了组件复用，防止组件的频繁销毁与创建，在遇到跳转的路由不一致才会进行重新渲染，路径参数变了他是不会管的，只会改变this.$route对象而已。我们可以写一个watch监视this.$route对象。一旦发生变化，则发请求重新渲染。就这个东西/:xxx。

使用了v-for循环，且v-for循环渲染出来的组件修改了数据，从而又驱动了响应式渲染，然后继续渲染v-for循环，然后v-for循环出来的数据里又修改了数据，从而达到死循环。那就是说，v-for里的变量在渲染结束前不能被修改，否则渲染到一半变量突然一变，新旧DOM一笔对，又得重新重新，然后死循环。究其原因是在v-for渲染结束前修改了变量，导致重新渲染，然后又修改变量…修改为独立的变量即可。

效果展示思路data数据结构第一个数组，用来存放标签库，供创建文章时选择第二个数组，用来存放从标签库选中后的标签， 且选中后需在可选的标签库里删除，否则出现同一个标签被多次添加js代码点击输入框，可展示所有标签/也可不展示，取决于组件身上属性（激活时展示or不展示）点击想要的标签，标签库移除，添加到选中数组内移除标签，标签库添加回去（后续还想选），然后从选中数组内移除是不是听的云里雾里？这里放一段gif演示确定的时候就把选中标签数组提交到后台这没什么好说的，数组转字符串扔过去即可

使用set集合的不重复特性,获取所有h标签,后续根据标签名,确定缩进值大小,h1-> 缩进级别为1,根据级别*padding-left的固定值实现分层。结尾设置监听器,等待文章目录的a标签映射上去之后监听,点击后调用高亮方法.将自身作用参数传递过去,增加类样式。操作文章的组件里挂载时判断是编辑还是新增，编辑则获取vuex数据到form表单对象。如果是发布新增，路径参数为0，如果是修改，参数为文章id，以此区分编辑还是发布。监听滚动视窗原理 在以往的文章有提及,可自行查找,这里不过多赘述了。

由于子评论通常以最早发送的在最上面，也就是升序排列，这里可以使用list身上的api，sort传入Comparator的静态方法comparing根据时间对比如果大的则交换位置，类似于冒泡排序，好像这里还可以传入一个匿名内部类自定义排列规则。由于list列表只能通过下标index，0，1，2，3获取对应的评论，我们这里用map给index映射一个id值，就可以根据评论id来获取list对应的评论。但是如果是这样的话，那我们给二级评论回复时，二级评论的父评论还是二级评论，这样就变成了3级节点。

mutation使用commitaction使用dispatch。

效果展示步骤1-表单收集输入信息<div class="commentorInfo"> <div style="position: relative"> <i class="fa fa-user" style="position:absolute;top: 50%;transform: translateY(-50%)transl

好比电梯门，每次都会进来新的人，只有最后一次进来的人之后，电梯门才会关上，否则每一个人进来了， 都会重置关门倒计时，也就是防止了持续的scroll事件而不持续的触发回调，也就是说不持续的关门开门关门开门。

回调判断滚动高度是否大于视口高度的1/2如果是，则设置动态样式的opacity为1，不是则隐藏为0。点击按钮触发置顶，scrollTo(0,0)滚动到 x y都为0的位置，也就是左上角。动态绑定样式style，监听点击事件，后续控制opacity透明度。实例及组件挂载后监听。

劫持数据，说的挺好听的，就是加工数据嘛，多了set变化触发了模板重新渲染，该渲染方式使用观察者模式，获取观察者收集的各个dom的所有属性 div，观察的属性，div的属性textContent，同时根据最新值渲染模板。data数据劫持，给data的每个属性增加get和set函数，当值改变时触发观察者的update方法，更新所有与当前属性值相关的dom元素。给每个dom节点增加观察者实例，由观察者群组管理，内部每一个键值含有多个对不同dom的观察者。配置对象传入vue实例。

将dist文件夹里的所有文件拷贝到站点的根目录，这里使用宝塔面板进行操作。也可以在文件目录下npm run build。前提你得先创建站点，域名绑定等操作。

因为vc关闭事件也跟着没，而这里的事件是在 原型上的，一直存在的不受vc关闭而关闭。而emit相当于说，说给耳朵听， 之前单纯的emit只能在父子组件通信，现在引入了一个传话的，隔代通信，事件名相当于一个人名，和谁通信的标识，当然这个on必须在挂载后执行类似于父组件监听子组件的 打个比方，所有子组件只是个可以反复利用的壳子，类似于高达积木，而正在要来拼接他们的是我们的APP组件，有大脑想法，可以决定怎么拼好看，且怎么上色也就是赋予数据得当。

echarts图表结合vue

部署vue项目到服务器时访问出现403错误