vue element的若干问题

源代码地址：https://github.com/taylorchen709/vue-admin

1.解决导航折叠，开启后，开启不全的问题

在Home.vue里，v-show="!collapsed"改成v-if="!collapsed"。

2.解决mock数据和真实数据的切换问题

把main.js中下面两行注释掉

import Mockfrom './mock'

Mock.bootstrap();

3.单击空白处，对话框消失（不用点击关闭按钮）

把下面代码修改：

旧：<el-dialog title="编辑" v-model="editFormVisible" :close-on-click-modal="false">

新：<el-dialog title="编辑" :visible.sync="addFormVisible">

close-on-click-modal="false" 就是点击空白关闭无效的意思

4.改变原有样式，弹出框在右边，上下撑满

<el-dialog title="編集" :visible.sync="editFormVisible" top="0px">

top="0px"为顶到字上层

<style lang="scss">

    .el-dialog{

position:fixed; //相对于浏览器窗口进行定位, 滚动条消失

height:100%;

width:600px;  //固定写死宽度，这样在浏览器大小变动的时候，弹出框宽度不变

left:calc(100% -600px);  //关键在此，计算。减去宽度的一半

    }

</style>

5.更新本地"element-ui"包的版本

# npm ls element-ui 查看本地element-ui的版本号

#手动修改修改package.json中包的版本号。1.2.8→2.4.7

#npm update element-ui 更新element-ui的版本号。

#如果有需要，在main.js中修改，element-ui的index.css的依赖路径