Vue
wingchiehpih
00年前端菜鸡程序员
展开
-
Vue 中文本内容超出规定行数后展开收起的处理的实现方法
参考文章:https://www.jb51.net/article/160354.htm<template> <div> <div :class="showTotal ? 'total-introduce' : 'detailed-introduce'"> <div class="intro-content" :aaa="introduce" ref="desc"> <span class="merchant-原创 2022-02-17 22:21:26 · 996 阅读 · 0 评论 -
Vuex复习
目录结构vuex页面展示效果home.vue文件调用了store中state中的counter<template> <div> {{ $store.state.counter }} </div></template><script>export default { name: 'about',};</script>App.vue<template> <div id=原创 2020-07-28 14:08:08 · 85 阅读 · 0 评论 -
vuex其实超简单,喝完这3步,还有3步
上一篇 vuex其实超简单,只需3步简单介绍了vuex的3步入门,不过为了初学者容易消化,我削减了很多内容,这一节,就是把少掉的内容补上,如果你没看过上篇,请戳链接过去先看一下再回来,否则,你会觉得本文摸不着头脑.原文地址: 点击这里纯属个人经验,难免有不正确的地方,如有发现,欢迎指正!还是一样,本文针对初学者.一、 Getter我们先回忆一下上一篇的代码computed:{ getName(){ return this.$store.state.name转载 2020-07-28 13:57:05 · 72 阅读 · 0 评论 -
vuex其实超简单,只需3步
原文地址: 点击跳转前言之前几个项目中,都多多少少碰到一些组件之间需要通信的地方,而因为种种原因,event bus 的成本反而比vuex还高, 所以技术选型上选用了 vuex, 但是不知道为什么,团队里的一些新人一听到vuex,就开始退缩了, 因为vuex 很难? 真的很难吗?今天我们用简单的3步来证明一下,vuex有多简单.纯属个人经验,难免有不正确的地方,如有发现,欢迎指正!这是一个针对新手的入门级教程、入门级教程、入门级教程第零步新建一个vue项目,安装vuex,这里不做过转载 2020-07-28 13:54:24 · 80 阅读 · 0 评论 -
Vue-router复习(动态路由、懒加载、重定向、传参、导航守卫、keep-alive)
Vue-router复习(动态路由、懒加载、传参、导航守卫、keep-alive)代码目录结构页面展示效果index.js路由配置import Vue from 'vue';import VueRouter from 'vue-router';import Home from '../views/Home.vue';// 修改路由push方法,阻止重复点击报错const originalPush = VueRouter.prototype.push;VueRouter.prototyp原创 2020-07-27 16:01:57 · 324 阅读 · 0 评论 -
Vue插槽具名插槽和作用域插槽(父组件展示子组件中的数据)
<template> <div> <son> <!-- <button>这是放在匿名插槽里的button</button> --> <!-- <div slot="left">这是放在具名插槽左边的数据</div> <div slot="right">这是放在具名插槽右边的数据</div>--> <!-- 这是作原创 2020-07-25 14:45:15 · 452 阅读 · 1 评论 -
Vue父子组件之间访问(父组件调用子组件方法)
<template> <div> <h1 @click="click">这是father组件</h1> <son ref="son"></son> </div></template><script>import son from "./son";export default { nane: "father", components: { son,原创 2020-07-25 13:52:33 · 382 阅读 · 0 评论 -
Vue父子组件之间通信(子向父、父向子组件传值)
父组件<template> <div> 这是father组件 <son son="son" @res="res"></son> </div></template><script>import son from "./son";export default { nane: "father", components: { son, }, data() { ret原创 2020-07-25 11:25:32 · 68 阅读 · 0 评论 -
Vue-router动态路由的使用(路由配置,传参)
Vue-router动态路由的使用动态路由router-link动态路由配置转载:编程让我快乐动态路由动态路由:当我们很多个页面或者组件都要被很多次重复利用的时候,我们的路由都指向同一个组件,这时候从不同组件进入一个"共用"的组件,并且还要传参数,渲染不同的数据,这就要用到动态路由跟路由传参了!router-linkrouter-link: 简单来说,它是个导航器,利用to属性导航...转载 2020-05-05 17:16:08 · 1406 阅读 · 0 评论 -
Element-UI的基本使用(命令行+图形化界面)
Element-UI的基本使用1、基于命令行方式手动安装2、基于图形化界面自动安装3、最终效果Element-UI:一套基于2.0的桌面端组件库官网地址:Element - 网站快速成型工具1、基于命令行方式手动安装1、安装依赖包 npm i element-ui -S2、导入 Element-UI相关资源// 入口文件 main.js// 导入组件库:import Element...原创 2020-05-04 13:27:49 · 1149 阅读 · 0 评论