
vue实战
vue实战
yang295242361
一个码农
展开
-
JSON-Viewer插件:json格式查看器
JSON-Viewer插件:json格式查看器。可以在页面中直接展示json格式的数据。原创 2024-07-31 09:50:09 · 2377 阅读 · 0 评论 -
通过计算确定添加全星半星和无星vue
const LENGTH = 5;const CLS_ON = 'on';const CLS_HALF = 'half';const CLS_OFF = 'off';itemClasses() {let result = [];let score = Math.floor(this.score*2)/2;let hasDecimal = score%1 !== 0;let integer = Math.floor...原创 2020-10-09 11:29:18 · 207 阅读 · 0 评论 -
解决vue项目路由出现message: "Navigating to current location (XXX) is not allowed"的问题
今天在写一个后台界面的时候,出现了这个报错,Navigating to current location ("/userslist") is not allowed问题。” 不允许导航到当前位置(“/userslist”)“在网上查了下,发现问题,大致如下:原因:当前访问的路由是相同的。解决办法:需要重写路由的push方法在【router/index.js路由页面】im...转载 2020-03-19 09:55:36 · 1758 阅读 · 0 评论 -
Vue main.js 文件中全局组件注册部分
在 \src\components\index.js 文件中export组件import HeaderList from './HeaderList'import HeaderMenu from './HeaderMenu'import HeaderPatient from './HeaderPatient'import ExitUser from './ExitUser'impor...原创 2020-03-19 09:35:42 · 2078 阅读 · 0 评论 -
this.$route.path
//获取当前路由地址//http://localhost:8002/#/addGoods => addGoodsthis.$route.path.replace('/','')原创 2020-03-12 15:14:00 · 12177 阅读 · 0 评论 -
Vue的slot-scope的场景
Vue的插槽slot,分为3种匿名插槽 具名插槽 作用域插槽作用域插槽的慨念,文档却只有一句描述有的时候你希望提供的组件带有一个可从子组件获取数据的可复用的插槽。下面是2个父子的vue组件,先解释一下2个组件做了什么事情父组件仅仅是调用了子组件 子组件内部实现了一个todolist列表我建议从数据流动的角度,理解插槽作用域的使用方式,1.父组件传递了todos数组给子...原创 2020-03-12 13:46:09 · 286 阅读 · 0 评论 -
Vue.extend() 动态创建实例(全局一个对话框或者弹出一条信息)
应用场景:显示一个对话框或者弹出一条信息下面我用一个全局提示组件为例,类似element-ui的message组件为大家演示一遍如何封装一个包含操作dom的的全局组件的,步骤主要有3步:1, 在componenets/Message 目录下新建一个Message.vue组件<template><transition name="fade"> <...转载 2020-03-12 09:49:26 · 1340 阅读 · 0 评论 -
vuex的使用实例
一:store数据仓库位置:二:store/user.js代码:(仅关于用户注册的数据)import Vue from 'vue'export const USER_SIGNIN = 'USER_SIGNIN' //登录成功export const USER_SIGNOUT = 'USER_SIGNOUT' //退出登录export default { stat...原创 2020-03-06 10:39:47 · 455 阅读 · 0 评论 -
vue router.beforeEach跳转路由验证用户登录状态
使用vue判断验证用户登录状态1 导航钩子类似于生命周期钩子,包含路由进入前,进入后,更新时,退出前等几个周期,主要用于控制导航的前进后退或跳转等。2 其中router.beforeEach就是路由进入前的周期,同时有路由的来源和去向两个参数,可以判断和控制当前路由的走向和重定向。3 一般router.beforeEach配合vuex全局状态储存使用,验证用户登录状态。也可以结合sessi...转载 2020-03-03 17:54:29 · 1266 阅读 · 0 评论 -
数字输入框组件
<div id="app"> <input-number v-model="value" :max="100" :min="0"></input-number></div>function isValueNumber(value) { return (/(^-?[0-9]+\.{1}\d+$)|(^-?[1-9][0-...原创 2020-02-26 15:16:49 · 517 阅读 · 0 评论 -
开发一个 实时时间转换指令 v-time
<div id="app" v-cloak> <div v-time="timeNow"></div> <div v-time="timeBefore"></div></div> var Time = { //获取当前时间戳 getUnix:function(){ ...原创 2020-02-26 10:04:27 · 457 阅读 · 0 评论 -
可从外部关闭的下拉菜单
<div id="app1" v-cloak> <div class="main" v-clickoutside="handleClose"> <button @click="show =!show">点击显示下拉菜单</button> <div class="dropdown" v-show="show"> &l...转载 2020-02-25 14:34:11 · 311 阅读 · 0 评论