67 lines
2.1 KiB
Markdown
67 lines
2.1 KiB
Markdown
# VUE个人积累
|
||
|
||
使用VUE-cli创建的项目发布之前必须将 config/index.js 中 build 下的 productionSourceMap: true, 改为 productionSourceMap: false, 否则生产环境中可以看见所有的源码
|
||
|
||
## vue-cookies
|
||
|
||
安装
|
||
|
||
`npm install vue-cookies --save`
|
||
|
||
使用
|
||
|
||
```js
|
||
import VueCookies from 'vue-cookies'
|
||
Vue.use(VueCookies)
|
||
```
|
||
|
||
Api
|
||
|
||
设置 cookie `this.$cookies.set(keyName, time) //return this`
|
||
|
||
获取 cookie `this.$cookies.get(keyName) // return value`
|
||
|
||
删除 cookie `this.$cookies.remove(keyName) // return false or true , warning： next version return this； use isKey(keyname) return true/false,please`
|
||
|
||
查看一个cookie是否存在（通过keyName）`this.$cookies.isKey(keyName) // return false or true`
|
||
|
||
获取所有cookie名称 `this.$cookies.keys() // return a array`
|
||
|
||
## nginx 配置
|
||
|
||
在vue路由模式为history的时候，刷新页面会出现404问题。我们只需要在服务器配置如果URL匹配不到任何静态资源，就跳转到默认的index.html。
|
||
|
||
```
|
||
server {
|
||
listen 8105; // 表示你nginx监听的端口号
|
||
root /home/admin/sites/vue-nginx/dist; // vue打包后的文件夹dist目录
|
||
index index.html;
|
||
location / {
|
||
try_files $uri $uri/ /index.html;
|
||
}
|
||
}
|
||
```
|
||
|
||
## 常见问题
|
||
|
||
* store的对象可以直接更改，换另一个变量存着也是同一个内存地址，，尽量避免直接操作
|
||
* var newObj = JSON.parse(JSON.stringify(obj)); 可以这样深拷贝
|
||
|
||
# vue typescript
|
||
* Component 装饰器 可以像类一样写
|
||
* 变量定义为undefined将不会具备更新视图的功能，如需要请用null，或者使用data钩子，写在return里边
|
||
* 组件的方法可以直接写在类里边
|
||
* 计算方法为get和set
|
||
* Component组件引用
|
||
```js
|
||
import OtherComponent from './OtherComponent.vue'
|
||
@Component({
|
||
// Specify `components` option.
|
||
// See Vue.js docs for all available options:
|
||
// https://vuejs.org/v2/api/#Options-Data
|
||
components: {
|
||
OtherComponent
|
||
}
|
||
})
|
||
* msg!: string 感叹号值得是告诉编译器这里一定有值
|
||
|