09 2021 档案

nuxt之vuex的使用
摘要：先来了解一下官网：https://www.nuxtjs.cn/guide/vuex-store 一、首先在 store 文件下新建一个index.js文件 const state = () => ({ flag: false }) const mutations = { add(state, dat 阅读全文
posted @ 2021-09-28 09:43 IT小姐姐 阅读(578) 评论(0) 推荐(0)
nuxt.js实现页面刷新功能
摘要：key 属性Key：String 或者Function key属性赋值到<router-view>，这对于在动态页面和不同路径中进行转换很有用。不同的key会使页面组件重新渲染。 设置key方法1 <nuxt :nuxt-child-key="someKey" /> 方法2 在页面组件中 expor 阅读全文
posted @ 2021-09-27 11:19 IT小姐姐 阅读(3133) 评论(0) 推荐(0)
nuxt 登录注册加重置密码
摘要：<!-- 登录弹框 --> <div class="mask" v-show="flag"> <div class="mask_content" v-show="type_d == 'sign'"> <p class="mask_gb" @click="cloces"> <img src="../s 阅读全文
posted @ 2021-09-27 09:08 IT小姐姐 阅读(187) 评论(0) 推荐(0)
vue中点按钮回到顶部，和elementUI中置顶按钮的实现
摘要：一般做pc项目都会遇到侧边小按钮点击回到顶部的功能，现在记录一下项目中的实现方法 一、结合动画效果实现 <li class="defa_bt" @click="hddb"> <img src="../static/img/home/bom01.png" alt=""> </li> methods: 阅读全文
posted @ 2021-09-24 09:23 IT小姐姐 阅读(700) 评论(0) 推荐(0)
Vue element 自定义表单验证(验证手机号)
摘要：<el-form :model="ruleForm" status-icon :rules="rules" ref="ruleForm" label-width="100px"> <el-form-item label="手机号" prop="phone"> <el-input v-model.nu 阅读全文
posted @ 2021-09-22 11:52 IT小姐姐 阅读(2098) 评论(0) 推荐(0)
nuxt.js中登录、注册（密码登录和手机验证码登录）
摘要：<!-- 登录弹框 --> <div class="mask" v-show="flag"> <div class="mask_content" v-show="type_d=='sign'"> <p class="mask_gb" @click="cloces"><img src="../stat 阅读全文
posted @ 2021-09-22 11:49 IT小姐姐 阅读(626) 评论(0) 推荐(0)
elementui中 分页在vue中的使用
摘要：template中： <el-pagination background layout="prev, pager, next" :total="total" :page-size ="per_page" :current-page="currentPage" @current-change="cur 阅读全文
posted @ 2021-09-22 11:35 IT小姐姐 阅读(409) 评论(0) 推荐(0)
a标签跳新链接，如果链接为空则不跳转
摘要：a标签跳新链接，如果链接为空则不跳转 <el-carousel-item v-for="item in slideList" :key="item.id"> <a v-if="item.link == '' " href="javascript:;" ><img :src="item.thumb" 阅读全文
posted @ 2021-09-18 23:17 IT小姐姐 阅读(273) 评论(0) 推荐(0)
input限制只能输入汉字
摘要：<el-form class="det_foot" :model="form" :rules="rules" ref="form"> <h3 class="det_lytitle">在线留言</h3> <el-form-item class="det_form"> <el-input v-model 阅读全文
posted @ 2021-09-18 08:59 IT小姐姐 阅读(592) 评论(0) 推荐(0)
css实现滤镜效果（背景图模糊）
摘要：模糊实例 图片使用高斯模糊效果： img { -webkit-filter: blur(5px); /* Chrome, Safari, Opera */ filter: blur(5px); } css语法： filter: none | blur() | brightness() | contr 阅读全文
posted @ 2021-09-08 10:37 IT小姐姐 阅读(383) 评论(0) 推荐(0)
vue 单独封装分页组件
摘要：一、在components文件夹下新建 pagination.vue <template> <div class="page-wrap"> <ul> <li class="li-page" :plain="true" @click="goPrePage">&laquo;</li> <li v-for 阅读全文
posted @ 2021-09-07 08:22 IT小姐姐 阅读(264) 评论(0) 推荐(0)
nuxt.js框架 如何打包 build
摘要：nuxt脚手架开发好项目后怎么打包 以下是脚手架的package.json部分代码 "scripts": { "dev": "cross-env NODE_ENV=development nodemon server/index.js --watch server", "build": "nuxt 阅读全文
posted @ 2021-09-06 09:05 IT小姐姐 阅读(1221) 评论(0) 推荐(0)