蓝桥杯web-31期楼赛题解（更新中）

题1：用Vue2的语法完成一个关键字匹配的搜索功能，这个自己去看相关方法相对简单，过了。

  filteredList() {

            // TODO: 请补充代码

            return this.postList.filter(item=>(item.title.search(this.search)!==1))

          },

题2：这题刚开始没看到用jquery语法，直接用Js写，后来看了一下直接利用

$（）方法直接循环遍历套用

题3：营销号生成器 额这个。 。 要注意是特定用户才能触发的。加个判断就好了

题4：卡片切换同题2类似，不过是用js写。注意两层for循环嵌套，用排他思想。

题5：个人博客  主要考察你对css的了解。

/* TODO:banner 上的文字 需要居中显示 */
.home-wrapper .banner .banner-conent .hero {
  margin-top: 3rem;
  text-align: center;
}

/* TODO: main-wrapper 通过设置main-wrapper 布局方式 让.main-left  .main-right 正确显示 */
.main-wrapper {
 
  margin: 0.5rem auto 1 auto;
  max-width: 1300px;
  padding: 0 0.9rem;
  box-sizing: border-box;
  position: relative;
  display: flex;
  flex-wrap: initial;
}

/*/* TODO 宽度自适应 居左显示 */
.main-wrapper .main-left {

  float: left;  

  box-sizing: border-box;
}

/* 宽 245px 居右显示 */
.main-wrapper .main-right>* {
  box-sizing: border-box;
  width: 245px;
 float: right;

}

注意flex布局和宽度自适应

题6：水果拼盘

这个太简单了，直接秒了没什么好说的

参考align-self 值 ： flex-start flex-end center baseline stretch order:<整数>(... -1, 0 (default), 1, ..)

就可以做出来

题7： 新年贺卡

这题真的让我纠结了一小会额。。。

最后原来是自己没看懂要求，耽误了几分钟

随机数函数 从 greetings 随机取一个值并返回

用random()函数就好了，数组[Math.floor((Math.random()*数组.length))] 就可以返回数组随机的值了，最后再调用show（）给贺卡框赋值就可以了

function show(greetingDisplay) {

greetingDisplay.innerText =writeGreeting()

}

题8：

这个题到最后一直给我提示页面差距大于20%

 同样的代码，十分钟前提交报错，十分钟之后直接通过？？？

待续。。。。。。。。

题9：

 

完善 css/style.css 样式文件，让登录页面呈现如上所示的效果。直接在css里面修改就可以了

页面关键样式说明如下：

• 表单外观样式：高为 600px、宽为 450px、背景颜色为 rgba(0, 0, 0, .45)、圆角边框为 10px。
• 表单顶部的头像图片样式：宽和高均为 200px、圆角 50%。
• 表单中的二级标题样式：字体大小为 45px、字体粗细为 800。
• 表单中按钮样式：宽为 80px、高为 30px、边框颜色为 #041c32、背景颜色为 #2d4263、字体大小为 16px、字体颜色为 white。
• 表单中输入框的样式：字体大小为 20px、圆角边框为 5px、宽度为 300px。

题10：【算法实现】小兔子爬楼梯

这题要根据规律

• 当阶梯数 n 为 0 时，直接返回 0。
• 当阶梯数 n 为 1 时，直接返回 1。
• 当阶梯数大于 1 时，假设有 i 阶梯子需要爬，就有 dp[i] 中方法。
• 3 阶以上的梯子，都满足一个规律：dp[i] = dp[i-1] + dp[i-2]。

然后在js文件代码中

加入if判断  返回就可以了

 题11：【功能实现】购物车

这个关键的地方就是利用axios来请求给出的json文件就可以了，