随笔分类 -  vue

上一页 1 2 3 4 5 6 下一页
如何将注释的代码折叠
摘要：// #region // methods:{ // addO(q){ // //发送请求前，在搜索中 // this.isFirst= false // this.isLoading= true // axios({ // url:"https://api.github.com/search/us 阅读全文
posted @ 2020-08-18 11:09 全情海洋 阅读(1305) 评论(0) 推荐(0)
vue基础（六）全局事件总线
摘要：全局事件总线原理图 通信方式 props 父子之间传递 父向子传递属性，通过属性把数据交给子组件 子向父传递数据，子组件通过调用父组件的行为函数，把数据当参数交给父组件 通信方式 全局事件总线（自定义事件是全局事件总线的基础） vm对象和组件对象的关系 vm的原型对象 组件对象的原型对象的原型对象 阅读全文
posted @ 2020-08-17 21:15 全情海洋 阅读(12988) 评论(0) 推荐(1)
vue基础（五），对todos的操作
摘要：对于totos的操作 入口main.js文件 // 引入vue import Vue from 'vue' // 引入App import App from './App' // 配置vue对象 new Vue({ el:"#root", // 注册组件，渲染组件 render : h=> h(Ap 阅读全文
posted @ 2020-08-17 11:05 全情海洋 阅读(900) 评论(0) 推荐(0)
vue中使用less出现的问题(style中使用less设置 scoped 遇到的坑)
摘要：最近在学vue的时候碰到的，在项目中的使用了 <style lang="less" scoped>，可以正常编译却不能启动成功，具体报错信息如下： 首先需要安装必要的插件 安装less依赖，npm install less less-loader --save 修改webpack.base.conf 阅读全文
posted @ 2020-08-15 16:07 全情海洋 阅读(11296) 评论(0) 推荐(0)
vue基础四（comment实例）
摘要：todos案例 App组件为总组件， 顶部header组件, add组件是左边的内容，添加评论，list组件是右边的评论回复， item组件是list的子组件 App组件 <template> <div id="app"> <div> <header class="site-header jumbo 阅读全文
posted @ 2020-08-15 14:25 全情海洋 阅读(6094) 评论(0) 推荐(1)
vue前台（十一）
摘要：一，我的订单获取数据进行展示 在center订单中心组建中，创建两个子路由组件，myorder组件， 我的订单， grouporder组件， 团购组件 <dd> <router-link to="/center/myorder">我的订单</router-link> </dd> <dd> <rout 阅读全文
posted @ 2020-08-12 20:01 全情海洋 阅读(435) 评论(0) 推荐(0)
vue基础（三）
摘要：1.vue中添加定时器 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <tit 阅读全文
posted @ 2020-08-12 14:29 全情海洋 阅读(188) 评论(0) 推荐(0)
vue-wabpack环境配置
摘要：-vuecomponents -src -components -Header.vue -Main.vue -Item.vue -Footer.vue -public -main.html -css -css.css -imgs -1.png -App.vue -main.js -.gitignor 阅读全文
posted @ 2020-08-12 10:27 全情海洋 阅读(153) 评论(0) 推荐(0)
vue基础（二）
摘要：1.css样式操作 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title 阅读全文
posted @ 2020-08-11 15:43 全情海洋 阅读(202) 评论(0) 推荐(0)
vue基础（一）
摘要：1.vue基础概念 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title 阅读全文
posted @ 2020-08-11 11:11 全情海洋 阅读(134) 评论(0) 推荐(0)
Vue中watch用法详解
摘要：基本用法： 当fullName值变化时，watch监听到并且执行 <div> <p>FullName: {{fullName}}</p> <p>FirstName: <input type="text" v-model="firstName"></p> </div> new Vue({ el: '# 阅读全文
posted @ 2020-08-11 09:21 全情海洋 阅读(1916) 评论(0) 推荐(0)
vue前台十（1）
摘要：一，订单交易页trade的数据展示 1.trade组件静态页面完成，创建trade.js的vuex,在总vuex中引入，注册 2.封装请求订单交易信息的函数接口 //请求订单交易信息 /api/order/auth/trade export const reqTradeInfo = () => Aj 阅读全文
posted @ 2020-08-10 20:53 全情海洋 阅读(274) 评论(0) 推荐(0)
vue前台(九)
摘要：一，购物车的删除 1.封装请求删除购物车商品函数 //请求删除购物车商品 /api/cart/deleteCart/{skuId} delete export const reqDeleteCart = (skuId) => Ajax.delete(`/cart/deleteCart/${skuId 阅读全文
posted @ 2020-07-31 06:47 全情海洋 阅读(352) 评论(0) 推荐(0)
vue前台(八)
摘要：一， 对商品的数量输入框做限制，change事件，对输入框修改数据后，失去焦点后，对于负数控制 <input autocomplete="off" class="itxt" v-model="skuNum" @change="$event.target.value*1 > 1? skuNum = $ 阅读全文
posted @ 2020-07-30 16:27 全情海洋 阅读(312) 评论(0) 推荐(0)
vue前台（七）
摘要：一，在detail组件中，向子组件zoom和 imglist传递数据，属性传递， 1.父组件detail computed: { ...mapGetters(["categoryView", "skuInfo", "spuSaleAttrList",'imgList']) }, 向子组件传递数据 < 阅读全文
posted @ 2020-07-21 19:40 全情海洋 阅读(243) 评论(0) 推荐(0)
vue前台（六点二）
摘要：一，分页组件连续页起始和结束计算 自定义通用的分页组件 实现静态组件（模板结构样式） 参考文档去获取 设计数据 外部接受的 当前页码 每页数量 总数 连续页码数量 一般都是奇数个 自己内部的 总页数 连续页码的起始和结束（比较恶心） 1、先判断连续页码是不是比最大的页码还要大，如果是那么start= 阅读全文
posted @ 2020-07-21 06:14 全情海洋 阅读(254) 评论(0) 推荐(0)
vue前台（六点一）
摘要：一，解决search多次跳转返回不能一次返回到首页 1.在search组件中，将push改成replace,没有路由历史记录，可以直接返回到home页 1.1, 在从search页跳转到search页，不需要有路由记录，直接用replace //删除面包屑的类别名称 removeCategoryNa 阅读全文
posted @ 2020-07-20 22:16 全情海洋 阅读(261) 评论(0) 推荐(0)
vue前台（五）
摘要：一，search组件的静态页面实现以及数据获取到vuex内 之前在home页，点击商品分类列表，跳转到search页，在search页我们需要获取数据，根据接口文档，需要一些请求参数，我们可从search组件的路由对象的query,params参数获取需要的请求参数，然后在beforemounted 阅读全文
posted @ 2020-07-20 18:15 全情海洋 阅读(298) 评论(0) 推荐(0)
vue前台（四点二）
摘要：一，处理swiper轮播图 在floor组件中， 轮播图html模板 <!-- <div class="swiper-container" ref="floor1Swiper"> <div class="swiper-wrapper"> <div class="swiper-slide" v-for 阅读全文
posted @ 2020-07-20 18:11 全情海洋 阅读(153) 评论(0) 推荐(0)
vue前台（四点一）
摘要：一，mockjs模拟banner和floor接口操作，组件获取数据 1.创建mock文件夹，创建banner.json和floor.json, mockServer.js(提供服务，模拟接口) 安装mockjs npm i mockjs mockServer.js 文件内容 //正儿八经的模拟接口 阅读全文
posted @ 2020-07-20 16:35 全情海洋 阅读(316) 评论(0) 推荐(0)

上一页 1 2 3 4 5 6 下一页