vue

Vue之插槽(Slot)

  • Post author:
  • Post category:vue

何为插槽 我们都知道在父子组件间可以通过v-bind,v-model搭配props 的方式传递值，但是我们传递的值都是以一些数字，字符串为主，但是假如我们要传递一个div或者其他的dom元素甚至是组件，那v-bind和v-model搭配props的方式就行不通了，但是插槽(slot)可以，插槽可以传递dom元素，在子组件中通过接收使用父组件传递过来的dom元素，我的理解就是在定义一个组件时，有些d…

继续阅读 Vue之插槽(Slot)

vue 打包完成之前不清除上次打包的内容

  • Post author:
  • Post category:vue

背景：在本公司通过jenkins构建项目的时候，对应项目在打包过程中，线上版本报错400. 原因：打包过程中，清除掉了dist文件夹下面的文件。 解决方式：通过vue-cli-serve自带命令，修改项目的package.json文件中的打包命令 文档地址： https://cli.vuejs.org/zh/guide/cli-service.html#vue-cli-service-build …

继续阅读 vue 打包完成之前不清除上次打包的内容

浅显易懂的vue-router源码解析(一)

  • Post author:
  • Post category:vue

前言 在正式进入 vue-router 之前,我们先从框架的思维跳出来,仔细思考一下前端路由的实现原理,观察如下案例. <body> <a onclick="jump('/a')">A</a> <a onclick="jump('/b')">B</a> <a onclick="jump('/c')">C</a> &…

继续阅读 浅显易懂的vue-router源码解析(一)

Vue cli 4.x Vue.config.js标准配置(最全注释)

  • Post author:
  • Post category:vue

Vue.js CLI工具 不知不觉发展到了4.0时代，CLI给人最直白的感受是没有了build文件夹跟config文件夹，所有的配置都在Vue.config.js完成。那么该文件的配置至关重要。现在我们来看一下最新配置是怎么配置的。 // vue.config.js const path = require("path"); function resolve(dir) { console.log(…

继续阅读 Vue cli 4.x Vue.config.js标准配置(最全注释)

vue 2.x 版本 基础知识点

  • Post author:
  • Post category:vue

Vue 是基于 MVVM 设计模式 是单页面应用 引入Vue代码 <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> 将标签绑定为Vue el 指定一个选择器, 代表该元素中使用vue来渲染 let app = new Vue({ el:"#app" })//app为标签id el支持cl…

继续阅读 vue 2.x 版本 基础知识点

html语言 输出文本,Vue实现将数据库中带html标签的内容输出(原始HTML(Raw HTML))

  • Post author:
  • Post category:vue

原始 HTML(Raw HTML) 双花括号语法，会将数据中的 HTML 转为纯文本后再进行插值。为了输出真正的 HTML，你需要使用 v-html 指令： 使用双花括号语法：{ { rawHtml }} 使用 v-html 指令： 使用双花括号语法： This should be red. 使用 v-html 指令：This should be red. span 中的内容，将会被替换为 raw…

继续阅读 html语言 输出文本,Vue实现将数据库中带html标签的内容输出(原始HTML(Raw HTML))

配置 Vue 实例（ 选项 ）

  • Post author:
  • Post category:vue

文章目录 一、总览 二、DOM 2.1 el && template 选项 2.2 render 选项 2.3 renderError 选项 三、数据 3.1 data 选项 3.2 props 选项 3.3 propsData 选项 3.4 computed 选项 3.5 watch 选项 3.6 methods 选项 四、生命周期钩子函数——全部组件 4.1 简介 4.2 图示…

继续阅读 配置 Vue 实例（ 选项 ）

记录，再次运行vue项目报错POST http://127.0.0.1:8888/api/private/v1/login/login

  • Post author:
  • Post category:vue

可以打开登录界面，却无法打开登录后界面 代码没有问题，查阅资料后是后台服务器没打开 删除package-lock.json文件 运行npm install 再次运行node .\app.js 打开phpStudy的数据库 使用postman测试 显示登录成功，后台数据库连接成功， 再次运行Vue项目，登录界面成功 版权声明：本文为qq_45654741原创文章，遵循 CC 4.0 BY-SA 版权…

继续阅读 记录，再次运行vue项目报错POST http://127.0.0.1:8888/api/private/v1/login/login

vue中render的常见用法(渲染按钮禁用/隐藏等状态)

  • Post author:
  • Post category:vue

简介** 在vue开发前端页面的过程中，对于一些较复杂的嵌套样式，用template不太方便的，一般要用到render函数来进行渲染。 ** render本身是一个函数，它的参数也是一个函数。 render(): (h) => { return h('div', '数据对象或者标签属性', '标签内容或子节点') } /* * 参数说明 * h：即render的参数，是一个函数，有三个参数 …

继续阅读 vue中render的常见用法(渲染按钮禁用/隐藏等状态)

vue 实现拖动元素

  • Post author:
  • Post category:vue

HTML： <div class="box" id="box"> <div v-drag class="drag"></div> </div> //注册局部组件指令 directives: { drag: function(el) { let dragBox = el; //获取当前元素 let imgMakeBox;//父盒子 let moveW …

继续阅读 vue 实现拖动元素