项目中遇到的问题（新）
用户投稿 学习笔记 6阅读
时间：2017年09月25日项目：《金银屋官网》问题：表单样式在 iOS 手机上不兼容描述: 按钮和 input 输入框在 iOS 上有默认样式，没有去掉 时间：2017年09月25日项目：《金银屋官网》问题：代码意图和逻辑没理清楚(function bottonm(){ if($(document).height()<$(window).height()){ $('.model-close').css({'position':'fixed','bottom':'20px'}); $(document).height($(window).height()+'px'); }})();$('.model-close') 是关闭弹出框表单的按钮，不会直接显示在页面，这段代码在 js 文件加载完就立即执行，没有任何意义，反而导致 JS 报错 时间：2017年09月25日项目：《金银屋官网》问题：不注意代码风格，没有遵守编码规范；有的代码加了分号有的没加；不该缩进的地方有缩进；同时使用了双引号和单引号；问题代码 1：success: function(resp) { if (resp.retcode === 2000000) { successshow.show() event.stopPropagation() } else { util.Alert('提示', resp.msg) }},error:function(xhr,type) { failshow.show() event.stopPropagation();}问题代码 2 (同时使用了双引号和单引号):$("#applycode").on('keyup',function(e){ 时间：2017年09月25日项目：《金银屋官网》问题：提交信息写错，deploy 写成 delplycommit 018461f1029d44543e69ce9f902d77170b1939e0Author: MOMO-0902 <329053928@qq.com>Date: Mon Sep 25 06:54:29 2017 +0800 修改delply以及部分样式 时间：2017年09月25日项目：《金银屋官网》问题：移动端line-height也不能实现准确垂直居中，字体整体靠上描述：移动端与pc端解析方式不一样，导致line-height出现偏差解决办法：使用display:table解决问题问题2：使用display:table后本来不一样的两个元素变的一样高描述：这是因为display:table是将子元素变成单元格一样的显示方式，所以是等高的解决办法：给高度较小的盒子外边套一层，再使用vertical-align:center 实现垂直居中//父元素.step{ display: table; height: 20px;}//子元素1显示数字.stepnum { display:table-cell; vertical-align: middle;}//子元素2显示文字.stepword { display:table-cell; vertical-align: middle; font-size: 14px;}//显示数字，是stpmnum的子元素.number { font-size: 12px; height: 16px;} 时间：2017年09月26日项目：《金银屋官网》问题：未选择房产和金额的时候点击提交按钮，报错 Cannot read property 'value' of undefinedlet houseoptions = $(".select-house option").not(function(){ return !this.selected })var house = houseoptions[0].value这段代码是想获取 select选中的option，然后再获取 option的value值，给select设置没有默认选中项，所以当没有手动选择一项就点提交，option的value值也是没有的解决办法：使用select.val()来获取select选中项的value值 时间：2017年09月26日项目：《金银屋官网》问题：未正确分清select option的value和text值描述：使用select.val()获取 选中项的value值 option的value值是要发送到服务器的值 select.text()获取所有option的值 option的text值是option的显示内容 时间：2017年09月26日项目：9.14-9.19一周学习分享问题：使用click与tap事件报错描述：由于zepto的touch.js版本过低，导致引入后页面发生事件报错 时间：2017年09月26日项目：9.14-9.19一周学习分享问题1：写ajax格式出错描述：$.ajax({}) 写成了 $(ajax).({}) $(“html元素”)，$相当于Jquery，意思是选取，查询，或创建页面中的一个或者一类html元素，并对它们进行操作 $.ajax({}) $.each({}) $.map({}) $作为功能函数的前缀，意为调用(.)jquery对象($)的方法(ajax), $(ajax)是利用选择器获取元素，所以并不能在后边加"."问题2：使用ajax传送数据与接收参数类型搞错描述：向服务器传送数据应该是data,不是dataType,dataType是期待服务器返回类型，contentType是发送到服务器类型一般为"application/json"$.ajax({ url: "http://www.baidu.com", data: {"username":username, "password":password}, dataType: "json", contentType: "application/json", timeout: 3000, content: "$("body"), success: function() {}, error: function() {} }) 时间：2017年09月27日项目：《wiki》写笔记问题：第二个##没有h2的样式描述：没有给h2下边加一空行，导致h2跟正文样式一样 问题：网页文档加载后的事件不执行时间：2017.09描述：第一次写的时候丢了function，这段代码的意思是当页面加载完成后执行此函数里边的函数，所以function(){}不能丢解决办法：$(document).ready(function(){function Func(){}}) 问题：使用$('option[selected]')不能获取slection选中的option值描述：zepto获取select元素的选中option不能用类似jq的方法$('option[selected]'),因为selected属性不是css的标准属性解决办法：使用$('option').not(function(){ return !this.selected })比如：jq:$this.find('option[selected]').attr('data-v') * 1zepto:$this.find('option').not(function() {return !this.selected}).attr('data-v') * 1但是获取有select中含有disabled属性的元素可以用$this.find("option:not(:disabled)")因为disabled是标准属性 时间：2017年10月08日项目：《钱隆归来》问题：使用display: inline-block后一行元素之间存在间距，导致给定宽度后一行占不下挤到下一行。描述：元素间留白间距出现的原因是标签段之间的空格，因此去掉html中的空格就可以去除间距。解决办法：<div class="investTabs tac"> <span class="investUser dib">用户</span ><span class="investMoney dib">购买金额(元)</span ><span class="investTime dib">时间</span></div> 时间：2017年10月08日项目：《钱隆归来》问题：使用table布局后，再使用border:0只能去除表格并不能去除表格以及单元格的边框解决办法：给table加 cellspacing="0" cellpadding="0"<table class="investTabs" border="0" cellspacing="0" cellpadding="0"> 时间：2017年10月13日项目：《钱隆归来》问题：在写计算属性的时候提示该属性已被定义描述：先在data里定义后再写的计算机属性，计算属性是被处理经过运算后的值，可以直接用在页面中显示中，不能先定义computed: { rateWidth: function() { return parseInt(`${this.data.sale_rate*100}%`) }}, 时间：2017年10月13日项目：《钱隆归来》问题：为元素写行内样式时不生效描述：未用vue重构前，行内样式写法是<div style="width: 8px"></div> 用vue重构后，此行内样式的值为计算属性中处理后的值，不能用html的文本插值来显示解决办法：为元素绑定自定义样式。1.直接引用单个的属性值//单位要用引号引起来<div :style = {width: rateWidth + '%'}></div><div :style = {width: rateWidth + 'px'}></div><div :style = {width: rateWidth + 'rem'}></div>2.绑定一个对象样式//此处注意样式写法，可以用驼峰也可以用短横线分隔，但短横线分隔要用引号引起来<div :style = "styleObject"></div>data: { styleObject: { 'background-color': '#fff'; fontSize: '12px' }} 问题: 验证码倒计时操作Props报错项目：《钱隆归来》描述: vue中父组件如果使用props向子组件传递数据后,一般不对props值作操作或改变,因为虽然父组件向子组件传递是单向数据流,但如果Props是一个数组或者对象时,共同引用同一个地址,在子组件改变props值会影响父组件的状态解决办法: 在data中定义一个局部变量,用Props的值初始化它,操作这个变量,然后再在页面中显示出来### js:props: [ 'btnname',],data (){ return { showName: this.btnname, }},function() { this.showName = `${time}秒后重新获取短信验证码`}### html :<button>{showName}</button> 问题: vue路由传递参数时传不过去项目：《钱隆归来》描述：使用<router-link :to="{ path: '/signup', params: {userPhone: myphone}}"><u>快速注册</u></router-link>传递参数错误，应该给router一个name，链接到命名路由，接收params参数,这是使用vue-router传递参数的第一种办法解决办法：//router.js{ path: '/login', name: 'login', component: Login,}//login.tpl 实现从登录页跳转到注册页把手机号传过去,此方法要把 to 写成 :to<router-link :to="{ name: 'signup', params: {userPhone: myphone}}"><u>快速注册</u></router-link>//signup.tpl 可直接显示此参数{{$router.params}} 问题：注册页to属性来接收路由传递的参数后未能正常显示在组件中项目：《钱隆归来》描述：因注册页是引用input组件，所以要将路由传递的参数通过props传到input子组件中，而在input子组件中使用value值接收v-model传递的参数，所以要将value显示赋值给子组件中input中显示的初始值myvalue.(myvalue是经过运算的props -- value值)解决办法：//signup.jsprops: [ 'value',]data() { return { myvalue: this.value, }} 问题：使用url传递参数的办法来传递路由时，跳转的路由不对项目：《钱隆归来》描述：路由中定义参数格式错误，写成了{ path: '/signup: phone', component: Login}解决办法： 路径中参数前应该有"/"{ path: '/signup/:phone', component: Login,}此为使用路由传递参数的第二种方法，登录页处a标签应为<router-link to="/signup/18713575939">快速注册</router-link> 问题: 直接在<router-link> :to 属性中使用url传递参数时，没有传递变量值而是传递变量名了项目：《钱隆归来》描述：使用<router-link :to="/signup/myphone"></router-link>，:to后边传递的属性值默认传成了字符串，显示的是"/signup/myphone"解决办法：属性值用"+"连接<router-link to="'signup/'+myphone"></router-link> 问题： 使用url传递参数时，如果省略参数则找不到正确的路由项目：《钱隆归来》描述：定义url时没有在参数后边加？，代表此参数是可省的解决办法：{ path: '/login/:phone?', component: Login,} 问题：checkbox不能实现正确切换项目：《钱隆归来》描述：checkbox要实现的功能是选中背景绿色，未选中无背景色，所以我1.在checkbox外加了一个div，使用v-on:class="{active: isActive}"为div加背景图（选中状态时），控制背景图的显示隐藏,使用v-model="toggle"来控制是否选中2.把chekbox隐藏3.可以实现背景图的显示隐藏，但并没有绑定checkbox.4.所以应为checkbox添加v-model="toggle"来控制是否选中才对。5.为checkbox添加@click事件来切换状态分析：6.但因为checkbox这时已隐藏并不能实现成功点击click，而且checkbox初始状态为false7.checkbox状态切换就是v-model的值，v-model初始值为true才可以实现加载时就选中，而div的背景图也要为true才显示解决办法:为checkbox和v-model绑定同一个值，实现选中就显示，不选中就隐藏而click事件就可以绑定在div上了，其实实现的只是简单切换功能。//chekbox<div :class="{active: isActive}" @click="isChecked"> <input type="checkbox" v-model="isActive"></div>//jsdata() { return { isActive: true, }},methods: { isChecked() { this.isActive = !this.isActive }} 问题：登录页注册页设置密码页等页面进行相互跳转时，如果不带参数，报错“Uncaught TypeError: Cannot read property 'length' of undefined”项目：《钱隆归来》描述：因为在引用的子组件中使用了"length"属性进行了判断，当跳转页面后如果没带参数的话，那么input的value值（路由带过来的）就是undefined，所以应该加上判断，当value值不是undefined时再使用length属性。解决办法：1.使用时直接判断当this.myvalue值不为undefined，并且长度大于0时，再显示if(this.myvalue !== undefined && this.myvalue.length > 0) { this.deltoshow = true;}2.不使用this.value.length来判断，直接把定义文本框输入文本的长度，如果是undefined就赋值为odata() { return { valueLength: this.value === undefined ? 0: this.value.length }} 问题2：此操作还是有问题，因为 valueLength 赋值为0后valueLength不能改变一直是0,所以图标一直不显示，应该要使valueLength的值实时改变，刚开始想要监听valueLength的值，但没起作用描述：watch是给变化的数据作监听，但valueLength并不是变化的数据，而myvalue才是变化的数据watch: { valueLength(value) { this.valueLength = this.value.length }}解决办法：监听myvalue的值，当myvalue值发生改变时，去改变valueLength的值watch: { myvalue(val) { this.$emit('input', val) this.valueLength = this.myvalue.length }} 问题：所有文本框type都变成了password项目：《钱隆归来》描述：判断inut的type时如果是password就显示可见密码图标和删除图标，但把"type == password"定成了"type = password"相当于赋值 问题： markdown不能正确解析描述： 在<>包含的属性两边没有加``，在markdown中，使用 "&"、" <"、 ">"会被文本默认为html语句，导致尖括号本身及尖括号中的内容都不会被显示解决办法：1.使用``代码来标记行内代码@ font-face { ` font-family: <YourWebFontName>`; `src: <source>[<format>][,<source>[<format>]] *` ; `[font-weight:<weight>]`; `[font-style: <style>]`; }2、使用``来包含<>@ font-face { font-family: `<YourWebFontName>`; src: `<source>` [<format>][,`<source>` [`<format>`]] * ; [font-weight: `<weight>`]; [font-style: `<style>`]; }3.使用代码区块```code```来包含这段代码<activity>```@font-face { font-family: <YourWebFontName>; src: <source> [<format>][,<source> [<format>]] * ; [font-weight: <weight>]; [font-style: <style>]; }```4.使用转义字符,使用"<"代替"<",使用">"来替代">"@font-face { font-family: <YourWebFontName>; src: <source>[<format>][,<source> [<format>]] * ; [font-weight: <weight>>]; [font-style: <style>]; }<div class="se-preview-section-delimiter"></div> 问题：使用git rebase 时报错，再使用git checkout branch也报错error: cannot stat filename: Permission denied，说没有权限描述：可能在windows下试图应用一个补丁的时候阻止git修改文件，也可能是编辑器锁定了该文件解决办法：将编辑器，命令行全部重启
标签：