2022-03-17 引入Router组件报错

JavaScript017

2022-03-17 引入Router组件报错,第1张

一、

引用router组件时报错。

原因是未在main.js的Vue实力中添加 router

二、引入router时必须小写router变量

三、在使用js的fillter方法时 将.fillter 错写为 .fillters

四、在用vue做菜单时,控制台提示:

vue.esm.js:628 [Vue warn]: Invalid prop: type check failed for prop "index". Expected String with value "1", got Number with value 1.

解决方法::index="item.id +'' "

五、实现router页面跳转 定义跳转点击事件 忘记传参 

加个函数修改下 就可以了

<html>

<head>

<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312">

<link rel="stylesheet" href="finance.css">

<title>合计</title>

</head>

<body background="image/beg1.gif" leftmargin="0" topmargin="0">

<br>

<form id="frmxx" name="frmxx" action="Manager_F_budgeteeringSave.asp" method=post >

<table width="800" border="0" align=center cellpadding="0" cellspacing="0" class="tableframe">

<tr align=center class=Listtitle>

<td class=listcelltitle width=50 align=center>2008年报表</td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data61" type="text" value="120" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data62" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data63" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data64" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data65" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data66" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data67" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data68" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data69" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data610" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data611" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data612" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data613" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data614" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data615" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data616" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data617" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data618" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data619" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data620" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data621" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data622" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data623" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data624" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data625" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data626" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data627" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data628" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data629" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data630" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data631" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data632" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data633" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data634" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data635" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data636" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data637" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data638" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data639" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data640" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data641" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data642" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data643" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data644" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data645" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data646" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data647" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data648" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data649" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data650" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data651" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data652" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data653" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data654" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data655" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data656" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data657" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data658" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data659" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data660" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data661" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1_1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data662" type="text" value="0" size="20">

</div></td>

</tr>

<tr align=left class=listrow1>

<td class=listcellrow nowrap align=right><div align="center">

<input name="data663" type="text" value="0" size="20">

</div></td>

</tr>

<tr class=listrow1_1>

<td colspan="9" nowrap class=listcellrow>

<div align="center">合计值文本框:

<input name="sumdata" type="text" value="0" size="20" onfocus="sumhe()">

</div></td>

</tr>

</table>

</form>

<script>

window.onload=sumhe

window.document.onkeyup=sumhe

function sumhe(){

var lens,kk

kk=0

lens=document.frmxx.elements.length-1

for(i=1i<=lensi++){

kk+=parseFloat(eval('document.frmxx.data6'+i+'').value)

}

document.frmxx.sumdata.value=kk

}

</script>

</body>

</html>

这是很多网页前端设计者都面临的一个问题,今天通过收集整理,把我常用的方法贴出来,希望能对需要的同行朋友有点帮助~~首称贴一段js代码:<script type="text/javascript">var Image = {}function SetMiddle(image, height){/// <summary>重设图片大小后让图片相对于DIV居中</summary>if (typeof(image) == 'string') image = document.images[image] || document.getElementById(image)var div = image.parentNodeif(div.nodeName != "DIV"){div = div.parentNode}if(image.height >0 &&image.height <height){var marginTopVal= (height - image.height) / 2image.style.marginTop =parseInt(marginTopVal)+"px"///不加px,在火狐下不支持!}else{image.height = heightimage.style.marginTop = "0px"}}Image.Resize1=function(image,width,height){if(width==null||height==null)returnimage.removeAttribute('width')image.removeAttribute('height')var w = image.width, h = image.heightvar scalingW=w/width,scalingH=h/heightvar scaling = w / hif(scalingW>=scalingH){image.width=widthimage.height = width / scaling}else{image.height=heightimage.width = height*scaling}}function imgReSize(imgObj,w,h){Image.Resize1(imgObj,w,h)SetMiddle(imgObj,h)}</script>下面是具体的图片调用js函数的方法:onload=imgReSize(this,628,452)函数有三个参数,第一个就不用说了吧,每二个参数是说图片的最大宽度,第三个参数是表示图片的最大高度当图片的宽高任一个大于参数里设置的值的时候,图片就会等比例缩小,且位置相对于外面的容器左右居中多的不说了,你懂的~~~