- 博客(41)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 vue2 双向数据绑定的实现及原理
configurable：属性是否可配置，默认为 false。descriptor：属性的描述符对象，包含属性的特性设置。enumerable：属性是否可枚举，默认为 false。writable：属性是否可写，默认为 false。value：属性的值，默认为 undefined。prop：要定义或修改的属性的名称。obj：要在其上定义属性的对象。get：获取属性值的函数。set：设置属性值的函数。
2024-05-14 13:25:43
336
原创 vue3 中vite.config.js相关常用配置详解
base: '/screen',//指定了应用程序在服务器上的根目录位置，设置连接前缀plugins: [vue(),],resolve: {alias: {},server: {open: '/docs/index.html',//开发服务器启动时，自动在浏览器中打开应用程序。proxy: {//代理cors： true,//为开发服务器配置 CORS。默认启用并允许任何源，传递一个 选项对象 来调整行为或设为 false 表示禁用。
2024-05-13 14:44:48
1055
原创 深拷贝浅拷贝赋值的问题
浅拷贝只复制指向某个对象的指针，而不复制对象本身，新旧对象还是共享同一块内存: 1:若第一层数据为基本数据类型,改变不会使原数据发生改变, 2:原数据中包含子对象的话,改变会使原数据发生改变 深拷贝会另外创造一个一模一样的对象，新对象跟原对象不共享内存，修改新对象不会改到原对象(对象数值互不影响) 赋值的话与原数据指向同一对象,无论哪个对象发生改变，其实都是改变的存储空间的内容，因此，两个对象是联动的...
2020-07-28 15:28:19
261
原创 vue router-view 组件的使用
router-view主要是构建 SPA (单页应用) 时，方便渲染你指定路由对应的组件。你可以 router-view 当做是一个容器，它渲染的组件是你使用 vue-router 指定的路由配置完成后, 就要使用 router-view 进行渲染了 (只要有子路由, 就要用它来渲染)<template> <div> <h1>Basic</h1> <ul> <li> <router-link to
2020-05-12 13:35:21
2329
2
原创 vue 中使用Bus进行通信
1：在main.js中定义并挂在Busconst bus = new Vue();Vue.prototype.$bus = bus2:兄弟组件的调用：child1组件中：通过事件点击利用$emit来发送事件：<template> <div class="c1"> <input type="button" @click="sendMsg" value="兄弟组件1" /> </div></template><
2020-05-11 11:59:09
926
翻译 vue axios get请求与post请求区别
执行GET请求// 为给定 ID 的 user 创建请求axios.get('/user?ID=12345') .then(function (response) { console.log(response); }) .catch(function (error) { console.log(error); });// 可选地，上面的请求可以这样做...
2020-04-02 11:08:39
2054
原创 ES6 中Promise对象与asyc函数
1：ES6 规定，Promise对象是一个构造函数，用来生成Promise实例。console.log('World!');let promise = new Promise(function(resove, reject) { console.log('promise'); resove(); });promise.t...
2020-03-30 11:04:17
345
原创 vue 中使用axios 的注意点
1:安装axiosnpm install axios2:导入axios(可在main.js中进行导入)import axios from ‘axios’3:注册axiosVue.prototype.$axios = axios; // Vue.use(axios);----此方法不试用于 axios(会报错)4：axios在组建中的使用this.$axios.pos...
2020-03-18 11:21:34
396
转载 exports 与moudle exports， export 与 export default
module.exports 、exports、export、export default的区别module.exports和exports是属于 CommonJS 模块规范，export和export default是属于ES6语法。module.exports和exports导出模块，用require引入模块。export和export default导出模块，import导入模块...
2020-03-09 14:21:47
186
原创 module.exports与exports区别
一：module.exports与exports区别：module.exports 初始值为一个空对象 {} exports 是指向的 module.exports 的引用 require() 返回的是 module.exports 而不是 exportsexports是引用module.exports的值。module.exports被改变的时候，exports不会被改变，而模块导...
2020-03-09 14:13:08
685
转载 Vue-router中beforeEach钩子函数实现路由拦截
需求：登录验证，即未登录时跳转至登录页路由中加入requireAuth: true，代表进入该路由需要验证{ path:'/Home', name:'首页', meta: { requireAuth: true // 添加该字段，表示进入这个路由是需要登录的 }, component: resolve =>...
2019-12-13 09:46:38
901
原创 前端map（）方法的使用
map()方法可以创建一个新数组，其结果是该数组中的每个元素都是调用一个提供的函数后返回的结果 var newArra=[1,3,6,12,54]; var newArrays=newArra.map((index)=>{ return index*index })// console.log(newA...
2019-11-11 16:27:26
16293
原创 路由 router-view 实现点击跳转时不打开新网页，而是在当前显示
1， 页面实现（html模版中）在vue-router中, 我们看到它定义了两个标签<router-link> 和<router-view>来对应点击和显示部分。<router-link> 就是定义页面中点击的部分，<router-view> 定义显示部分，就是点击后，区配的内容显示在什么地方。所以 <router-link> 还有一个...
2019-08-08 11:40:00
5011
原创 微信内调用微信支付，微信外浏览器调用微信支付接口（前端操作）
微信内支付后台配置好返回json数组，前端直接根据json进行操作即可h5支付的话，后台返回的是xml,前端直接调用链接即可判断是否是微信平台isWeiXin(){ //判断是否微信平台 var ua = window.navigator.userAgent.toLowerCase(); if (ua.match(/MicroMessenger/i) == '...
2019-07-22 18:20:50
3241
原创 获取cookie
获取cookie； var strcookie = document.cookie; //获取cookie字符串 console.log(strcookie); var arrcookie = strcookie.split("; "); //分割 // cons...
2019-07-08 17:49:29
814
原创 swipper.js 轮播常见方法的总结
1：new Swiper(swiperContainer, parameters)var swiper = new Swiper('.swiper-container', { loop: true, // 循环模式选项 slidesPerView: 3,//一行显示3个 slidesPerColumn: 2,///显示2行 ...
2019-06-20 14:20:15
691
原创 vue 常用相关问题
vue常用的修饰符？.prevent: 提交事件不再重载页面；.stop: 阻止单击事件冒泡；.self: 当事件发生在该元素本身而不是子元素的时候会触发；.capture: 事件侦听，事件发生的时候会调用 , .trim清除空格v-if 和 v-show 区别v-if按照条件是否渲染，v-show是display的block或none；$route和$router的区...
2019-06-20 10:41:05
181
原创 vue 路由传值与跳转
特别注意：命名路由这种方式传递的参数，如果在目标页面刷新是会出错的使用方法如下：this.$router.push({ name: 'news', params: { userId: 123 }})接收值：this.$route.params.userId查询参数其实就是在路由地址后面带上参数和传统的url参数一致的，传递参数使用query而且必须配合path来传递参数而不...
2019-06-06 14:25:18
2986
原创 vue 父子组件传值
1:父组件向子组件传值父组件部分：在调用组件的时候，使用 v-bind 将 logo 的值绑定为 App.vue 中定义的变量 logoMsg子组件部分：这是 header.vue 的 HTML 部分，logo 是在 data 中定义的变量。如果需要从父组件获取 logo 的值，就需要使用props: ['logo']在 props 中添加了元...
2019-06-06 13:34:37
211
原创 vue 钩子函数
created ：是在页面渲染之前发生的 ，如果想要获取数据渲染到html之后元素的宽高 这些事拿不到的。mounted：是在渲染data里面的数据到页面上之后 发生的 所以这时候去元素的具体信息是可以拿到的。...
2019-06-06 11:53:28
964
转载 vue去掉#，history模式
一、vue项目携带一个#会对开发造成一定的影响：1、微信三方登录回调地址，有#号时，接收不到code参数2、微信H5支付的回调地址，不允许有#3、App分享，处理特殊字符时，可能会对#进行编译4、有点影响美观现在网站大多有三方登录，支付等功能，存在#，项目开发就存在很大的障碍。话不多说，开始去掉#吧。二、去#的原理vue把#当做自己的根目录，静态资源，比如图片。去掉...
2019-06-06 10:34:14
1293
原创 cookie 跨域名存值
1: var ss=window.btoa(“123”); document.cookie="USERID="+ss+";domain=.gsvonline.org;path=/"; alert("login successful"); location.href=""+forward+"";2:MDN中给出了base6...
2019-04-19 18:13:02
384
原创 登录之后从返回之前的页面(简单便捷易懂)
通过document.referrer获取进入到此页面前的地址var forward =document.referrer; if(forward==""||forward==undefined||forward==null){ forward="index.html";}else{ location....
2019-04-19 18:08:18
4655
原创 vue+element 表格中全选与清除选中
表格中添加 事件@selection-change （回调参数为选中的选项）事件名 说明 参数 select 当用户手动勾选数据行的 Checkbox 时触发的事件 selection, row select-all 当用户手动勾选全选 Checkbox 时触发的事件 selection selection-change 当选择项发生变化...
2019-04-11 14:57:48
29999
原创 vue 支付密码的代码实现
html:<div class="w_next clear"> <span class="marginR_10 margin_b15">输入密码</span> <div class="keyWord"> <input type="text" maxlength=&qu
2019-03-08 11:21:15
1105
原创 element 表格无数据，获取相关表格数据从而进行批量删除等功能
一：表格无数据时相关操作1:表格无数据时默认操作：empty-text：空数据时显示的文本内容，默认为暂无数据，可以在表格里设置empty-text=“xxx”来改变默认的数据2：通过slot="empty"来自定义无数据时显示的内容<el-table-column></el-table-column> <!--暂无数据表示--...
2019-03-04 13:30:15
453
原创 vue+element上传图片并显示预览图
html代码： <el-upload class="avatar-uploader aUpload" action="" :show-file-list="false" :on-success="handleAvatarSuccess" ...
2019-02-20 17:58:29
16327
1
原创 for 循环点击标签循环高亮：class=["classA","classB"]
HTML代码：<div :class="[classA, classB]">Demo6</div>Javascript代码：data: { classA: 'class-a',//类名 classB: 'class-b'}渲染后的HTML:<div class="class-a class-b">Demo6</div> ...
2019-02-20 15:09:03
1221
翻译 身份证日期与与出生日期的验证
/** * 身份证号码与出生日期的验证 * 前提是：身份证号和出生日期格式都已经过格式验证 * 身份证号为15或18位，出生日期格式为XXXX-XX-XX */ function checkIdAndBirthday(strId,strBrithday){ //alert(strId); //alert(strBrithday); ...
2019-02-12 16:16:19
1884
原创 点击h5里的按钮返回安卓APP
关于Android与JS网页端的交互，网上有很多教程，刚做这功能，参考了多方资料，最终出来后觉得简单，但是为实现的话有诸多小问题，最终效果如下：<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html>&l...
2018-11-26 19:58:49
3769
转载 IOS里嵌套h5,h5返回app的操作
JS调用OC此时就要用到WKScriptMessageHandler了 //首先.m中加入属性 @property (nonatomic ,strong)WKUserContentController * userCC;//1 遵循WKScriptMessageHandler协议//2 初始化 WKWebViewConfiguration * config = [[WKW...
2018-11-26 19:48:25
3219
转载 往数组里循环插入对象
循环往数组中插入对象循环往数组中插入对象时要确保每次都创建一个新的对象，不能重复使用之前的对象 //错误的方法var arr = [];var obj = {};for (var i = 0; i < 10; i++) { obj.id = i; arr.push(obj);}//正确的方法var arr = [];for (...
2018-10-24 18:54:36
2988
原创 delete，remove，splice删除数组元素的区别
remove() 方法用于从下拉列表删除选项。语法selectObject.remove(index)参数 描述 index 必需。规定要删除的选项的索引号。 说明该方法从选项数组的指定位置移除 <option> 元素。如果指定的下标比 0 小，或者大于或等于选项的数目，remove() 方法会忽略它并什么也不做。 1、原数组被修改；2...
2018-10-24 18:47:14
10226
原创 点击空白弹窗消失效果
html <div id="user_login"><div class="login_content"></div></div> $("#user_login").click(function(event){ var _con = $('.login_content'); // 设置目标区域
2018-08-28 10:49:06
876
翻译 load()方法---------jQuery动态加载html
jquery代码$("#div").load("test.html"); test.html ----------------被加载页面（有<HTML><HEAD><META><BODY>等的完整页面 ） $("#div")所在页面----------------------------容器页面（也是完整页面） 1、
2018-08-28 09:14:20
3993
原创 多图上传，限制上传图片个数（增删）及限制上传图片的大小
html代码<div class="media_con Indus_license_up"> <ul class="up_ul"> <!--<li> <img src="ajaxImageUplo
2018-08-21 18:18:03
3479
原创 input 框上传单张图片上传形成缩略图，并限制上传图片的大小
html 代码<div class="upload_right fl File_1_up"> <div class="upload_upimg"> <img id="img_preview" data-src="" src="img/ti
2018-08-21 17:58:21
1098
原创 a链接点击事件失效的方法
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <a oncl
2018-08-17 13:56:10
4422
原创 split（）将字符串切割成数组
stringObject.split(separator,howmany)separator 必需。字符串或正则表达式，从该参数指定的地方分割 stringObject。 howmany 可选。该参数可指定返回的数组的最大长度。如果设置了该参数，返回的子串不会多于这个参数指定的数组。如果没有设置该参数，整个字符串都会被分割，不考虑它的长度。 注意：1：如果把空字...
2018-08-17 13:49:09
13109
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人