Vue-SuperSlide(SuperSlide component for Vue)

  • Post author:
  • Post category:vue

Vue-SuperSlide Vue-SuperSlide( Github ) 是 SuperSlide 的 Vue 封装版本,API 配置及使用方法与 SuperSlide 几乎一致,让你能够便捷的在 Vue 工程中使用 SuperSlide。 简介 关于 SuperSlide 的详细介绍可以到 SuperSlide 官方网站 - 大话主席 进行查看。 大话主席的 SuperSlide 是多年以…

继续阅读 Vue-SuperSlide(SuperSlide component for Vue)

Docker打包vue项目镜像(生产环境)

  • Post author:
  • Post category:vue

Docker打包vue项目镜像 一、第一步 新建一个文件夹,在该文件夹目录下,新建一个nginx配置文件,代码如下: default.conf server { listen 80; server_name localhost; # docker服务宿主机的ip location / { root /usr/share/nginx/html; index index.html index.htm;…

继续阅读 Docker打包vue项目镜像(生产环境)

vue2数据响应式原理

  • Post author:
  • Post category:vue

什么是数据响应式原理?数据响应式原理就是当数据发生变化时,视图也会更新。即数据驱动页面变化。 vue2中是如何实现数据响应式的呢?vue2中就是利用就是利用Object. defineProperty 数据劫持 和观察者模式实现的数据响应式的。 Object.defineProperty(target,key,value),接收三个参数,第一是目标对象,第二个是对象中的key值,第三个key值对应…

继续阅读 vue2数据响应式原理

vue+element el-tree 最详细的使用方法,真实接口数据渲染

  • Post author:
  • Post category:vue

el-tree的使用: 项目:接口给到的数据是嵌套children的,另外接口中的choose字段表示是否被选中,choose : true需要时选中状态; <div class="menu-permission"> <p class="title">菜单权限</p> <el-tree ref="menutree" :data="menuList" // …

继续阅读 vue+element el-tree 最详细的使用方法,真实接口数据渲染

vue中实现 图片的放大缩小和拖拽

  • Post author:
  • Post category:vue

html <template> <div v-if="popupVisible" class="image-back" @mousewheel.prevent="gunLun"> <div :style="imageItemToDisplay.data" class="image-inner" ref="imgWrap"> <i class="iconfo…

继续阅读 vue中实现 图片的放大缩小和拖拽

vue组件父子传值实例

  • Post author:
  • Post category:vue

父页面: <template> <div class="management infoPartner"> <el-tabs v-model="activeName"> <el-tab-pane label="子组件" name="second" lazy> <info-check @transfer='getProjectVisible'/&g…

继续阅读 vue组件父子传值实例

解决vue的跨域问题

  • Post author:
  • Post category:vue

解决跨域在vue.config.js的文件中,添加devServer中的proxy属性 如果项目中仅仅修改一个端口号 devServer:{ proxy:"http://localhost:5000" } 如果一个项目中产生多个跨域 devServer:{ proxy:{ "/api":{ target:"http://localhost:5000", pathRewrite:{'^/api':'…

继续阅读 解决vue的跨域问题

谷歌装vue拓展

  • Post author:
  • Post category:vue

1,在百度网盘中下载压缩包,网盘地址:https://pan.baidu.com/s/1i6UdvCD,密码:nvfe ( 自己已保存文件 ) 2,将压缩包解压到F盘,F:\chromeVue插件 3,复制文件地址,F:\chromeVue插件\vue-devtools-master 4,打开cmd命令,进入F盘,然后进入到vue-devtools-master文件中,命令:cd  F:\chro…

继续阅读 谷歌装vue拓展

vue中使用element ui的el-table在el-table-column下使用slot插槽v-if条件渲染没生效或者混乱

  • Post author:
  • Post category:vue

vue 引入element ui中的el-table组件时,在el-table-column下使用作用域插槽,通过v-if条件来动态显示某些元素,发现有的条目渲染没生效或者混乱。如: <el-table-column label="操作" align="center"> <template slot-scope="scope"> <el-button size="mi…

继续阅读 vue中使用element ui的el-table在el-table-column下使用slot插槽v-if条件渲染没生效或者混乱

vue跨域问题

  • Post author:
  • Post category:vue

1.proxy代理解决跨域 export default defineConfig({ plugins: [ vue(), AutoImport({ resolvers: [ElementPlusResolver()], }), Components({ resolvers: [ElementPlusResolver()], }) ], server: { // port: 4000, // 设置…

继续阅读 vue跨域问题