工作VUE布局记录

以这个页面为例子这个是你的布局有多少行,这个页面有两行,这里是2 这里span是占用多少格(一共24格)offset左右偏移,这个基本上用不到row是表示这个控件在第几行,如果是在第二行就写2pull:向左推进多少格push:向右推进多少格你们这个问题可以通过设置pull属性和style的width属性搭配一起解决比如这个页面里,第二行第二个控件我设置了pull:2,但是刚好顶到第一个控件那里了,再把第1个控件的width设置短一些,就好了Get&Set 2018-3-8 1…

iOS 工作遇到问题记录

iOS 工作遇到问题记录 1.UITableView的scrollDelegate问题下午遇到一个奇怪的问题,之前都没有注意过,由于A VC中要实现tableView和其他View位置的联动,所以实现了tableView的delegate中的scrollViewDidScroll方法,结果在点击商品push 商品详情VC B 的时候,问题出现了. 问题表现:在调用[self.navigationController pushViewController:productDetailVC anim…

Vue 问题记录

Vue 问题记录汇总日常开发中遇到的关于vue的问题 VeeValidator 语言设置校验消息默认是英文的,定义中文或其他语言的错误提示消息 import VeeValidate from 'vee-validate'; import Vue from 'vue' Vue.use(VeeValidate) var dict = { zh_CN: { messages: { required: function(field){ return field + '不能为空!'; }, betwe…

Vue学习记录第一篇——Vue入门基础

前面的话 Vue中文文档写得很好,界面清爽,内容翔实.但文档毕竟不是教程,文档一上来出现了大量的新概念,对于新手而言,并不友好.个人还是比较喜欢类似于<JS高级程序设计>的风格,从浅入深,娓娓道来于是,还是按照自己的思路,对Vue的知识体系从浅入深的开始学习.本文是Vue学习记录的第一篇,介绍Vue入门基础.把学习记录总结成博客,也是希望能够帮助到同样入门Vue的朋友概述 Vue.js对自己的定位是一套构建用户界面的渐进式框架.如下图所示下面来解释下,何为渐进式框架如果只使用Vue最基…

Vue学习记录第一天

今天开始了Vue的学习,下面我就记录一下学习了什么. 1.什么是Vue? vue是一套基于javaScript的渐进式框架,是MVVM框架.View ——ViewModel——Model 其中View就是视图层, Model就是数据层,而中间的监控者就负责监控两侧的数据,并相对应地通知另一侧进行修改.比如,你在数据层改变了某个数据的值,那么视图层的数据也会修改.这个过程就是有ViewModel来操作的,不需要你手动地去写代码去实现(你不用再手动操作DOM了). 2.Vue的基础知识点: 1)数…

vue 项目记录.路飞学城(一)

前情提要: 通过vue 搭建路飞学城记录一:项目分析二:项目搭建 1:创建项目 vue init webpack luffy 2:初始化项目清除默认的HelloWorld.vue组件和APP.vue中的默认模板代码和默认样式 2>1: 清除位置 2>2:修改后效果 2>3:结果图三:引入ElementUI 1:快速安装ElementUI 对于前端页面布局,我们可以使用一些开源的UI框架来配合开发,Vue开发前端项目中,比较常用的就是ElementUI了. ElementUI是饿…

vue学习记录④（路由传参）

通过上篇文章对路由的工作原理有了基本的了解,现在我们一起来学习路由是如何传递参数的,也就是带参数的跳转. 带参数的跳转,一般是两种方式: ①.a标签直接跳转. ②点击按钮,触发函数跳转. 在上篇文章中我们已经有两个页面(Helloworld.vue&Hello.vue),现在我准备往Hello.vue里面添加3个链接,分别对应两种情况的跳转. 第一步:在原来的Hello.vue里添加路由链接跳转的代码(见第38-44行代码),添加后的Hello.vue代码如下: <template>…

vue学习记录③（路由）

上篇文章我们用vue-cli脚手架工具做了个简单的hello world页面,但是我们破坏了原来的流程,而正常的访问页面应该是通过路由来实现的. 那么什么是路由呢? 路由就是通过不同的url来访问不同的内容. 下面我们就通过路由来访问不同的页面吧~~~ 我们用vue-cli新建个项目test1.并运行: 如上图可以访问到默认的欢迎页面. 那么这个页面在vue中是怎么组成的呢?可以分析一下: 先看App.vue这个入口组件. . 再来看Hello.vue这个组件. 好了,这个欢迎页面我们基本分析清…

vue实战记录（五）- vue实现购物车功能之商品总金额计算和单选全选删除功能

vue实战,一步步实现vue购物车功能的过程记录,课程与素材来自慕课网,自己搭建了express本地服务器来请求数据作者:狐狸家的鱼本文链接:vue实战-实现购物车功能(五) GitHub:sueRimn 一.单价商品的金额计算整个操作过程是,商品的数量是可以控制的,可增可减,最少为1.并且在数量的变化中,商品的总价也在变化. 控制数量与总价的变化需要定义新方法. 页面中的+和-控制数量的变化,当点击的时候调用changeMoney()函数,传递参数,通过数量的变化去改变金额.+的时候增1…

vue实战记录（六）- vue实现购物车功能之地址列表选配

vue实战,一步步实现vue购物车功能的过程记录,课程与素材来自慕课网,自己搭建了express本地服务器来请求数据作者:狐狸家的鱼本文链接:vue实战-实现购物车功能(六) GitHub:sueRimn 主要实现地址页面的适配和设置地址默认与删除,以及更多显示的状态取反. address.html  <div class="checkout-title"> <span>配送地址</span>…

vue实战记录（四）- vue实现购物车功能之过滤器的使用

vue实战,一步步实现vue购物车功能的过程记录,课程与素材来自慕课网,自己搭建了express本地服务器来请求数据作者:狐狸家的鱼本文链接:vue实战-实现购物车功能(四) GitHub:sueRimn 一.过滤器filter 1.定义 Vue.js 允许自定义过滤器,可被用于一些常见的文本格式化用在两个地方:双花括号插值和 v-bind 表达式 (后者从 2.1.0+ 开始支持) 添加在 JavaScript 表达式的尾部,由“管道”符号指示 2.注册过滤器注册和组件相同有两种注册方…

vue实战记录（三）- vue实现购物车功能之渲染商品列表

vue实战,一步步实现vue购物车功能的过程记录,课程与素材来自慕课网,自己搭建了express本地服务器来请求数据作者:狐狸家的鱼本文链接:vue实战-实现购物车功能(三) GitHub:sueRimn 模仿网页考拉的购物车样式进行了一些修改,以上图片就是渲染后的效果. 一.cart.js获取数据通过AJAX获取本地的json数据,这里会出现跨域问题,还好提前搭建了本地服务器,可以成功获取数据渲染界面. 当通过get获取地址数据时,可以在调试界面看到我们需要的数据有哪些,从而获取数据的i…

vue实战记录（二）- vue实现购物车功能之创建vue实例

vue实战,一步步实现vue购物车功能的过程记录,课程与素材来自慕课网,自己搭建了express本地服务器来请求数据作者:狐狸家的鱼本文链接:vue实战-实现购物车功能(二) GitHub:sueRimn 一.前言上一篇讲解了如何运用node.js+express搭建本地服务器,解决chrome浏览器跨域而导致无法获取本地数据的问题,这章讲解如何创建本地实例. 二.安装vue依赖在vs code终端输入以下命令安装vue依赖: npm install vue --save 结束后继续输入…

vue实战记录（一）- vue实现购物车功能之前提准备

vue实战,一步步实现vue购物车功能的过程记录,课程与素材来自慕课网,自己搭建了express本地服务器来请求数据作者:狐狸家的鱼本文链接:vue实战-实现购物车功能(一) GitHub:sueRimn 一.前提准备 1.vue基础指令的使用:v-model .v-text.v-show.v-if.v-bind.v-for.v-on 过滤器filter 组件component 2.购物车实现创建Vue实例通过v-for渲染产品使用filter对金额和图片进行格式化使用v-on实现…

Vue随笔记录

一.创建Vue步骤(VS Code) 1.全局安装 npm install -g vue-cli 2.新建项目 vue init webpack "project-name" 3.安装依赖 npm i 4.运行 npm run dev 二.Vue架构 1).记住“三个位置”: 1.router-->index.js(存放路由.路由组件.路由页面路径等) 注:此项目默认路径是“/”.在path下一行加入(redirect:“/test…

css布局记录之双飞翼布局、圣杯布局

双飞翼布局和圣杯布局是比较常用的布局方式,都是为了实现一行三列,并且两侧列固定宽度,中间列宽度自适应的效果:直接上代码记录下: <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1…

vue学习记录

vue中常用的指令 v-model 双向数据绑定,一般用于表单元素 v-for 对数组或对象进行循环操作,使用的是v-for <li v-for="value in arr">{{value}}</li> <li v-for="(v,k) in arr">{{k}}={{v}}</li> <!-- 可以直接循环包含重复数据的集合,可以通过…

vue培训记录

在公司做了一次vue相关的培训,自己整理了一些大纲.供大家参考学习! ### 1. 项目构成及原理 [Vue](https://cn.vuejs.org/)###* 主流框架见解及差别 * react ALL IN JS 灵活 * angular 架构清晰层级多重 * vue 类似react并吸收了angular的一些优点* Node运行在服务端的JS * 谷歌V8引擎使JS语言能在服务器端运行 * Webpack—一个前端的打包工具 * 模块化拆分js * 使开发环境的代码能被浏览器编译…

vue学习记录：vue引入，validator验证，数据信息，vuex数据共享

最近在学习vue,关于学习过程中所遇到的问题进行记录,包含vue引入,validator验证,数据信息,vuex数据共享,传值问题记录 1.vue 引入vue vue的大致形式如下: <template> </template> <script> </script> <style> </style> 要引入其他vue ,需要 import <template> <div> <Header></…

[20190614]webpack+vue学习记录

本文记录一些学习webpack+vue相关的知识点,方便以后查阅,添加或修改 1. 初始化vue项目的代码结构 build--项目依赖包配置信息 config--项目配置文件 dev.env.js--开发环境配置文件 index.js--基础配置文件 prod.env.js--线上环境配置文件 mode_module--依赖包文件 src--项目源码 assets--项目图片资源 components--项目小组件 router--项目路由 App.vue--项目根组件文件 main.js--项…

Vue学习记录（二）-打包问题

由于项目需要,vue项目在build打包之后,希望有一个类似wbeconfig的配置文件.方便判断应用所处的环境.进行相应的逻辑处理. 这边暂时记录一下思路,具体请看友情链接. 方案一:从环境变量下手 vue-cli3环境变量与分环境打包 Vue CLI 环境变量和模式方案二:加一个不被打包的文件,访问该文件获取配置链接:vue外部打包路径封装,公用文件(配置等)[来自简书用户:站在大神的肩膀上看世界 …

vue开发记录

vue开发过程中遇到的一些小问题.小技巧等,会不断更新~ 记录不详细处,欢迎留言…

vue中记录页面的滚动距离

业务需求:pageOne页面是一个商品列表页面,在这个页面点击商品,就会跳转到pageTwo商品详细页面.此时再从pageTwo页面返回到pageOne页面时,pageOne页面需要做到:1.记录pageOne之前的滚动的距离.2.不重新请求数据.而从其它页面进入到pageOne页面时,pageOne页面不需要记录之前的滚动距离和需要重新请求数据. 1.使用keep-alive组件的实现方法 App.vue <template> <div id="app"> &…

（转）工作之路---记录LZ如何在两年半的时间内升为PM

原文地址:http://www.cnblogs.com/zuoxiaolong/p/life31.html 引言之前的伪PM纠结之路已经渐渐结束,LZ也终于正式爬上了PM的位置,对于LZ来说,这个时间比LZ预计的早来了两年半.说起来,两年半的速度已经算是比较快了,但这之中的努力唯有LZ一人知晓.写这篇文章,一是LZ最近工作比较繁忙,再没有了当初作为程序猿的悠闲自在,为了弥补这段时间博文的空缺.二则是为了分享自己的工作之路,以期能够给一些刚进入岗位的新人们些许指导. 在正式开始本文之前,LZ觉得…

android 代码布局记录

1.概述 android 中大部分ui 布局是用xml 进行的,但是用代码布局调整是不可避免的.自己比较喜欢写模版,有些时候子类再继承模版时,往往有一些ui上的调整,又懒得去重写一个xml,就偷懒用代码微调ui的布局 2.常用的微调已经设置过布局的width height 后直接get 过来改长宽是会报错的.对应正确的操作是先 getLayoutParams() 回来再改长宽,对齐方式等,设置完毕requestLayout() 回去 ex1: mEmojiView = (ImageView)…

将数据的初始化放到docker中的整个工作过程(问题记录)

将数据的初始化放到docker中的整个工作过程由于是打算作为个人博客,所以对于install这个步骤,我从一开始就打算删掉的,前面一个多星期一直在修bug,到前天才开始做这个事情. 过程中也是碰到了各种问题,花了整整三天时间才完整的解决并实现了这个过程. 1.首先是思路的整理,如何去实现install过程的docker化. 由于原来是直接用的mysql5.7官方镜像,所以mysql数据的导入就不好实现,因此需要在原官方镜像的基础上重新创建镜像, 实现方法及所需文件都在在mysql文件夹下. 2…

关于Vue问题记录

第一次安装Vue时,npm run dev报错处理 1.如果是报错:提示说没找到test这个文件夹参考资料:https://segmentfault.com/q/1010000010893904 就是直接在报错的文件夹地址中简单粗暴新建一个test文件夹就可以了!!!我也不知道什么原理..反正建了就可以启动了. 2.第二次启动vue,使用npm run dev又报错:module.js:491 throw err; ^ Error: Cannot find module 'c…

vue 实践记录

打包后使用相对路径在 build/webpack.prod.conf.js 的 output 节点添加配置:publicPath: './' 打包时使用shell复制文件在入口 build/build.js 中使用. 引入 shelljs库 require('shelljs/global') 使用示例:cp('-R', 'favicon.ico', config.build.assetsRoot) 不同环境使用不同模式加载路由( vue 开发环境不适用懒加载) router目录结构 _imp…

vue学习记录⑤（组件通信-父与子）

今天我们看一下组件通信. 经过前面几篇文章,我们已经可以构建出完整的单个组件,并利用路由使其串联起来访问了. 但这明显还是不够的.一个页面不可能就是个单组件,一般是由多个组件合成的.正因为如此,组件之间肯定是有相互关系的,我们就称这种现象叫组件通信. 比如父组件发生了某项改变,子组件会跟着相应发生变化:反过来,子组件有了某种改变,父组件有时也会随之做出调整.那么这种现象我们称之为双向数据流动. 然而,vue的作者敏锐的认识到,双向数据流带来便捷的同时,也存在着极大的安全隐患. 父组件将变化传递给…

vue学习记录②（hello world！）

接着上篇vue-cli脚手架构建项目结构建好项目之后,就开始写个“hello world!”吧~~~ vue玩的都是组件,所以开发的也是组件. 1.新建helloworld.vue.(删除Hello.vue)代码如下:  <template> <div class="container"> <h1>hello,world!</h1> <p>{{test}}</p> </div…

【工作VUE布局记录】的更多相关文章