苦涩记忆

<el-table-column prop="content" label="内容" align="center" > <template slot-scope="scope"> <div v-html='scope.row.content'></div> </template> </el-table-column>

vue 通过scoped可以将样式隔离在组件内，从而组件之间的样式互相不影响，但是当我们需要在当前组件改变其他组件样式时，就不适用了。这时我们可以使用**样式透传**，意思就是将该样式透过scoped。scss/sass 的vue样式透传语法：本组件选择器 ::v-deep 其他组件选择器...

使用picker-options属性，直接上代码<el-date-picker v-model="form.date" type="datetime" placeholder="选择时间" value-format="yyyy-MM-dd HH:mm:ss" :picker-options="{ disabledDate: (time) => {

一、 技术栈VueJs+ElementUI+WebSocket/stopmJs+百度地图API+nodeJs/MockJs运行平台：现代浏览器（Chrome、Firefox、Edge以及大部分国产浏览器的极速模式）二、 框架选型Vue全家桶（vue+vue-router+axios）主要特性：1、 渐进式MVVM框架2、 组件化编程，方便复用3、 虚拟DOM技术，页面性能好4、 API简洁明了5、 社区丰富强大Vue vs React1、 都支持平台级的大型复杂应用，生态都很丰富2

vue在开发的时候代理接口配置在vue.config.js中module.exports={··· devServer：{ ··· porxy:{ '/api': { // 调用的接口前缀 target: "http://192.168.x.xxx:6180", // 代理的ip+port changeOrigin: true, // 是否允许跨域 secure: false, // 是否是https请求 path

安装nginx下载解压就可以了配置代理nginx/conf/nginx.confserver { listen 8088; #访问的端口 server_name localhost; #ip,服务器名 #charset koi8-r; #access_log logs/host.access.log main; root F:\szpf\coding\shenzhen-oa-website-mas

使用辅助函数解释小仓库模块的state。vuex 中出现[vuex] module namespace not found in mapActions(): money找不到的报错要在小仓库模块中加入namespaced:true,如下

记录一下vue路由自动注册的一种方式根据src/views文件夹的路径自动注册路由，文件结构如下：src|--view|----page1 // 页面一|------components // 页面一的组件|------index.vue // 页面一的入口组件|----page2 // 页面2|------components // 页面2的组件|------index.vue // 页面2的入口组件|----index.vue // 公共的布局组件router/index.js

在src目录下创建plugin文件夹，新建一个filters.js专门存放过滤器。filters.js/** * 过滤字符串中html标签 * @param {String} val */export const srciptHtml = (val)=>{ return val.replace(/<\/?.+?>/g,"");}在main.js引入important * as filters from '../plugin/filters'Object

<el-table-column prop="content" label="内容" align="center"> <template slot-scope="scope"> <div v-html='scope.row.content'></div> </template></el-table-column>

公共组件主要解决了多个应用直接组件的公用问题。这里使用npm构建我们的组件库。最终目录使用vue-cli 搭建一个项目vue create pubilc-compenent 将生成的项目的src文件夹改成examples (组件示例)新建vue配置文件，更改入口地址，确保改名后的examples能运行。新建packages文件夹，存放我们的组件编写第一个组件,参考element-ui结构datePicker.vue<template> <div>这是一

vue的插件，我们通常用来封装一些使用频率很高的全局资源，如：全局属性/方法、全局混入mixins、全局组件等。其实还是解决一个问题，更方便的复用。定义一个插件我们在src/plugin下新建一个index.js，定义的方法和属性一定是在install方法内。index.jsexport default { install(Vue){ // 定义全局属性 Vue.prototype.$myPlugin = '全局属性'; // 定义全局方法

vue已经给我们内置了很多很好用的指令了（v-mode 、v-show）等等，但是有时候当这些指令不能满足我们需求的时候，我们还可以使用vue的自定义指令功能编写我们的指令，这是一个很强大的功能。需要说明的是：尽管自定义指令这个功能很强大，但是其是对普通的DOM底层进行了直接的操作，会消耗一定的性能，所以我们在使用的时候一定要权衡利弊。全局定义我们可以使用vue的接口Vue.directive()去定义一个自定义的指令。// 第一个参数为指令的名称，第二参数则是一个对象，包含了指令的钩子函数Vue

关于vue的混入，官方给出是说明是这样的，这是一种非常灵活的方式，用来分发vue组件中可复用的功能。混入对象可以包含所有的组件选项。什么意思？使用场景在这里我们可以看到，混入唯一的功能还是解决代码的复用问题，其实很容易理解。就是将我们组件中多次用到的功能（可以包括组件的所有选项）抽离处理，做成公共的功能，然后在需要使用的组件使用mixins进行引用。如果多oop思想有深入理解的同学，可以参照oop思想帮助理解，和oop有一定的相似。其中最典型也是最常用的场景就是：要求界面显示风格不一样，但是里面的

1、 什么是动态组件动态组件是指：在一个挂载点使用多个组件，并进行动态切换。可能对于新手来说，这句话有些难理解，什么是挂载点?可以简单的理解为页面的一个位置。最常见的就是：tab的切换功能。在vue要实现这个功能通常用两种方式。一是使用<component>元素的 is 的特性，二是使用 v-if 。方式一：<template> <div class="hello"> <h3>使用component 的 is特性</h3>

vue的官方文档中介绍插槽是说：slot是一套内容分发的Api。那我们怎么理解solt呢？1、作用插槽可以让用户去扩展组件，增强了组件的扩展性，使得组建的复用更加强大。2、使用场景在组件化开发中，我们说，通常会把一段复用的代码单独写成一个组件，但是有时仅仅是这样不能满足需求，这时候可以用到插槽。通过父组件向子组件分发内容。插槽可以让调用者（父组件）实现结构和样式的自定义。3、插槽的使用3.1、匿名插槽子组件：<!-- --><template> <div

使用vue开发的，在初始化的渲染时候，有时会shan出现煽动一下，这是由于刚下载好js文件，还没有完全渲染引起的，通常使用脚手架开发是不会有这个问题的，但是有时我们使用非脚手架开发就会有这个问题。

我们从vue的原理上来理解一下vue的生命周期，以及使用场景（使用场景应该试很多新手同学比较懵的地方），建议有条件的同学可以看一下vue源码，更能深入理解。不看源码的同学也没有关系，我们从业务场景切入，尽量讲清楚它的用法。

我们使用vue的时候都知道vue有一个很好用watch可以用来监听数据的变化，但是，默认的时候是监听不到对象变化的，这时候就要配置deep=true这个字段。代码：watch: { // 监听对象数据变化 objData: { handler(newVal, oldVal) { console.log(newVal) console,log(oldVal) }, deep: true // 非常非常重要，这个是深度监

vue-cli是vue项目开发是脚手架工具，那么什么脚手架？脚手架引自工地里边方便房屋建造和装修的支架。在编程里边脚手架可以看做是一个项目模板，帮我们自动化的搭建好了开发环境，搞定了我们目录结构、本地调试、代码部署、热加载以及单元测试等工作，有了脚手架我们可以更方便的建造更高的楼。使用vue-cil创建项目第一步：安装nodejs在nodejs官方网站nodejs.org，下载LTS版本的n...