vue2全局图标组件

1.全局注册组件方法可参考我的 上一篇文章2.设计组件在 @/components/ 目录下新建一个 Icon文件夹,文件夹内容如下我使用的图标库是iconfont上的Ant图标引入方法可参考 这篇文章把图标添加到项目之后,下载下来得到以下文件,将红色框框的文件复制到 @/components/Icon/iconfont目录下然后编写index.vue,直接上代码<template>

- 阅读全文 -

vue-cli 3自动导入全局组件

官方方法在此之前可以参考一下官方文档,参考完之后可以参考一下我稍作修改之后的方法如果你恰好使用了 webpack (或在内部使用了 webpack 的 Vue CLI 3+),那么就可以使用 require.context 只全局注册这些非常通用的基础组件。这里有一份可以让你在应用入口文件 (比如 src/main.js) 中全局导入基础组件的示例代码:import Vue from 'vue'

- 阅读全文 -

vue自定义一个全局消息弹窗组件

通过Vue.extend + $mount方法来构造一个带动画的可调用的全局组件,效果如下步骤如下先在components/目录下创建一个tips的文件夹再新建index.vue和tips.js的文件分别填入以下内容,并且修改main.js文件内容和public目录下index.html的内容index.vue<template> <div class="msg

- 阅读全文 -

深度选择器(样式穿透)

在 vue 项目的开发过程,会遇到在父组件中想要修改子组件的样式,如:官网地址:Scoped CSS | Vue Loader (vuejs.org)父组件:father.vue<script> import child from "./child.vue" </script> <template> <child cla

- 阅读全文 -

今天吃什么?

解决今天吃什么的问题,可以自己添加食物可也以用现成的使用到的技术:vue2 + element-ui<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatib

- 阅读全文 -

Vue操作变量时原始数据被改变

原因我们想要实现的效果是当将A变量赋值给新的B变量时操作B变量而不影响A变量,但这种做法其实是通过浅拷贝copy出一份数据变成两份一样的基础数据,但是B=A的方式只是将B指向A的存储地址,实际上只有同一份数据,因此无论修改A还是B都是会互相影响的。解决方案先用JSON.stringify()从A对象中解析出字符串,再用JSON.parse()将解析出的字符串转换成JSON对象,这样可以得到两份一样

- 阅读全文 -

uView2.0 swipe-action-item组件页面无法上下滑动

原因主要是因为uView在组件中加了一条touch-action: none(touch-action用于设置触摸屏用户如何操纵元素的区域)属性导致无法上下进行滚动。我选择的解决方法是直接修改uView组件样式。修改前.u-swipe-action-item { position: relative; overflow: hidden; /* #ifndef APP-NVU

- 阅读全文 -

小程序获得data中的值与Vue的差距

Vue 中 data 的取值data() { return { name: '小李' }; }, methods:{ click(){ // data取值 console.log(this.name) } }微信小程序中 data 取值data: { name: '小李' }, click(){ con

- 阅读全文 -

vue页面间传参

rout-link标签跳转携带参数<template> <div id="app"> <!-- 不带参数 --> <div><router-link :to="/">首页</router-link></div> <!-- 路由路径 -->

- 阅读全文 -