vue
记录vue学习经验
Robert_c
这个作者很懒,什么都没留下…
展开
-
vue-弹窗数据刷新时强制渲染
<script> export default{ data(){}, methods:{ refresh(){ ... this.$forceUpdate()//在数据刷新的方法内调用该函数即可 } } }</script>这样就能实现数据刷新却没有渲染的问题...原创 2021-11-08 14:04:31 · 979 阅读 · 0 评论 -
vue-vuedraggable实现表格行拖拽
首先下载依赖包 npm install vuedraggable -Snpm install vuedraggable -S然后在需要的页面引入并注册,使用即可<template> <div class="demo"> <table class="dataTabble"> <thead> <tr> <th w原创 2021-09-10 18:44:32 · 491 阅读 · 0 评论 -
vue-使用过滤器给v-html限制长度
今天遇到个需求,需要在展示v-html的时候限制其长度并用省略号替代。记录一下<template> <div> <!--这里的content是获取到的数据--> <span v-html=""$options.filters.setContent(content)""></span> </div></template><script> export原创 2021-09-01 19:52:46 · 843 阅读 · 1 评论 -
vue-轻量级富文本编辑器推荐
最近遇到个需求,需要在页面中引入富文本编辑器。最后选择使用wangEditor,直接引入即可使用,因此记录一下。引入方式如下:import E from 'wangeditor'const editor = new E('#div1')editor.create()更多配置可以参考官方使用文档更多内容可以去官网...原创 2021-08-31 18:02:38 · 656 阅读 · 0 评论 -
vue-如何获取上一个路由地址
今天遇到需要调用上一个路由地址,并根据不同地址进行跳转。记录一下:<template> <div> <a-button @click="routeBack()">返回</a-button> </div></template><script> export default{ name:'demo', data(){ ret原创 2021-08-26 11:13:50 · 10823 阅读 · 3 评论 -
vue-axios的安装及四个常见方法
特征基于Promise 用于浏览器和 nodejs ,特征如下:从浏览器中创建 XMLHttpRequest 支持 Promise API 从 node.js 发出 http 请求 拦截请求和响应 转换请求和响应数据 自动转换JSON数据 取消请求 支持防止 CSRF/XSRF安装axios可以通过npm安装或者cdn引入npm:npm install axios --savecdn:<script src="https://unpkg.com/原创 2021-08-18 13:36:51 · 14618 阅读 · 0 评论 -
vue-获取路由携带参数
一般vue项目跳转路由时,往往跳转时会携带一些参数。那么在新的页面如何获取该参数?只需要在新页面中的computed里面这么写即可:<script>export default{ name:'demo', computed:{ id(){ return this.$route.query.id } }}</script>...原创 2021-08-11 12:15:56 · 2040 阅读 · 0 评论 -
vue-二维码批量导出下载
继上次vue-二维码生成记录,原创 2021-08-10 17:29:11 · 907 阅读 · 3 评论 -
vue-router如何以新窗口标签形式打开
<router-link>实现:vue2版本的 <router-link> 可以在里面添加一个target="_blank" 属性如下所示,这样就能实现以新的标签页面打开该页面<router-link target="_blank" :to="{path:'/demo',query:{value1:'1',value2:'2'}}">open</router-link>使用router.resolve实现我们可以使用window.op原创 2021-08-07 14:13:32 · 899 阅读 · 0 评论 -
vue-封装组件
平时经常遇到需要封装一个组件的情况,因此记录一下为什么要封装组件?能够把页面抽象成多个相对独立的模块 实现代码重用,提高开发效率和代码质量,使得代码易于维护步骤:这里我主要是将一个vue实例给封装起来,也算比较简单。新建一个vue实例文件,并写好代码 在需要使用的页面进行引入,我使用的是import demo from '@/components/demo.vue' 进行注册,这里分为全局注册和局部注册两种。全局注册则需要在Vue.component('demo')注册;局部注册原创 2021-08-06 15:52:46 · 382 阅读 · 0 评论 -
vue-二维码
Vue-qr实现二维码的生成原创 2021-08-04 00:03:25 · 231 阅读 · 0 评论 -
vue-组件通信
vue组件通信父子组件:props:在父组件对子组件上赋值,:vmodel指的是传给子组件的变量名,vmodel指的是data对象里面的vmodel属性值,可以写成一个对象的某个值,比如car.light等等<children :vmodel="vmodel"></children>然后在子组件中,通过设定props便可以直接引入该变量<script> new Vue({ el:"#app", props:["vmodel"],原创 2021-08-01 17:06:15 · 77 阅读 · 0 评论