![](https://img-blog.csdnimg.cn/20201014180756780.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
weixin_46852620
这个作者很懒,什么都没留下…
展开
-
多行文字溢出隐藏
display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;原创 2021-08-27 09:57:32 · 154 阅读 · 0 评论 -
vue 子路由如何调用父路由中的方法
在父路由界面中有部分是子路由的内容,而问题是子路由的操作完成后需要调用父路由的一个方法来改变父路由中的样式main.jsVue.prototype.$bus = new Vue()父路由页面<template> <router-view></router-view></template>export default { name: "father", mounted() { let _this = this原创 2021-02-13 17:40:19 · 1763 阅读 · 1 评论 -
v-model修饰符
1.lazy修饰符:默认情况下,v-model默认是在input事件中同步输入框的数据的。也就是说,一旦有数据发生改变对应的data中的数据就会自动发生改变。lazy修饰符可以让数据在失去焦点或者回车时才会更新:2.number修饰符:默认情况下,在输入框中无论我们输入的是字母还是数字,都会被当做字符串类型进行处理。但是如果我们希望处理的是数字类型,那么最好直接将内容当做数字处理。number修饰符可以让在输入框中输入的内容自动转成数字类型:3.trim修饰符:如果输入的内容首尾有很多空格原创 2021-02-07 21:57:57 · 63 阅读 · 0 评论 -
vue路由导航守卫
vue的路由守卫分为三种:全局路由守卫、组件内路由守卫和路由独享守卫。一、全局路由守卫全局路由守卫分为两种:全局前置守卫和全局后置钩子一.全局前置守卫 //语法: router.beforeEach((to, from, next) => { //... next() }) //使用: router.beforeEach((to, from, next) => { //我在这里模仿了一个.原创 2021-02-02 10:01:21 · 84 阅读 · 0 评论 -
内置组件
componenttransitionkeep-aliveslot不同组件之间进行动态的切换//两个子组件var son1 = { template: ` <div> <h1>子组件-1</h1> <slot>子组件-1的默认内容</slot> </div> `}var son2 = { template: `原创 2021-02-02 10:00:53 · 68 阅读 · 0 评论 -
vue-router的使用
路由配置index.jsimport Vue from 'vue'import VueRouter from 'vue-router'import Login from "../components/Login.vue"import Home from "../components/Home.vue"import Wellcome from "../components/Wellcome.vue"import User from "../components/User.vue"Vue.原创 2021-02-02 10:00:39 · 62 阅读 · 0 评论 -
解决vue-router使用 history 模式刷新后404问题
因为我们的应用是单页客户端应用,当使用 history 模式时,URL 就像正常的 url,可以直接访问http://www.xxx.com/user/id,但是因为vue-router设置的路径不是真实存在的路径,所以刷新就会返回404错误。想要history模式正常访问,还需要后台配置支持。要在服务端增加一个覆盖所有情况的候选资源:如果 URL 匹配不到任何静态资源,则应该返回同一个 index.html 页面,这个页面就是你 app 依赖的页面。也就是在服务端修改404错误页面的配置路径,让其指向原创 2021-02-01 20:26:09 · 1324 阅读 · 0 评论 -
hash和history两种模式的区别
两种模式的区别1.hash 就是指 url 尾巴后的 # 号以及后面的字符,history没有带#,外观上比hash 模式好看些3.hash模式在每次刷新页面时是直接更改“#”后的东西,history每次刷新会重新像后端请求整个网址,也就是重新请求服务器。如果后端没有及时响应,就会报错404!3.hash 模式下,仅 hash 符号之前的内容会被包含在请求中,如 http://www.abc.com,因此对于后端来说,即使没有做到对路由的全覆盖,也不会返回 404 错误。history 模式下,前端的原创 2021-02-01 20:22:55 · 255 阅读 · 0 评论 -
watch
new Vue({ el: '#root', data: { name: {id: 1, name: 'beijin'} }, watch: { name: { handler(newName, oldName) { // ... }, deep: true, immediate: true }, // 监听路由的改变 $route: { handler(newName, oldName) {原创 2021-02-01 18:36:39 · 65 阅读 · 0 评论 -
axios发送并发请求
同时发送两个请求1.使用axios.all, 可以放入多个请求的数组2.axios.all([]) 返回的结果是一个数组,使用 axios.spread 可将数组 [res1,res2] 展开为 res1, res2原创 2021-02-01 13:43:32 · 154 阅读 · 1 评论 -
封装axios
network.jsimport axios from "axios"export function request(options) { // 1.创建axios的实例 const instance = axios.create({ baseURL: "http://127.0.0.1:8888/api/private/v1/", timeout: 5000 }) // 过滤器(拦截器) instance.int原创 2021-02-01 12:52:47 · 57 阅读 · 0 评论 -
vue动态绑定属性拼接
<el-menu-item :index="`/${i.path}`" >原创 2021-01-29 10:53:42 · 1101 阅读 · 0 评论 -
vue3路由
import { createRouter, createWebHistory, RouteRecordRaw, createWebHashHistory, RouteLocationNormalized, NavigationGuardNext,} from "vue-router";import layout from "../views/layout.vue";import strategy111 from "../views/strategy111.vue";imp原创 2021-01-30 15:37:21 · 805 阅读 · 0 评论