2021年11月_cdgogo

原创【微信小程序】知识点总结

路由wx.switchTab(Object object)跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面wx.reLaunch(Object object)关闭所有页面，打开到应用内的某个页面wx.redirectTo(Object object)关闭当前页面，跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面。wx.navigateTo(Object object)保留当前页面，跳转到应用内的某个页面。但是不能跳到 tabbar 页面。使用 wx.navigat

2021-11-12 22:45:40 461

原创【微信小程序】3D效果轮播图

效果图：<view class='swiper-container'> <swiper class='swiper-block' autoplay='true' circular='true' previous-margin='90rpx' next-margin='90rpx' current='0' bindchange='swiperChange' interval='5000' duration='1000'> <block wx:key='unique

2021-11-12 21:20:43 2031

原创【微信小程序】自定义导航栏

大部分情况下我们都是使用微信官方自带的 navigationBar 配置，但有时候我们需要在导航栏集成搜索框、自定义背景图、返回首页按钮等。思路隐藏官方导航栏获取胶囊按钮、状态栏相关数据以供后续计算根据不同机型计算导航栏高度编写新的导航栏页面引用自定义导航一、隐藏官方导航栏隐藏导航栏可以全局配置，也可以单独页面配置，具体根据业务需求来。{ "path" : "pages/public/login", "style": { "navigationB.

2021-11-12 19:29:32 1420

原创【微信小程序】组件封装

效果图：说明：该小程序中多个页面用到房屋装修设计表单和底部tabbar导航栏，为了修改方便，把他们封装层组件然后调用即可。组件结构如下：组件写好后，我们需要注册组件，可以在app.json中全局注册，也可以直接在需要用到的页面中年注册。引用组件：在自定义组件中会发现无法获取到外部公用的样式，即全局样式（比如：字体图标样式），解决办法：只要在对应组件的js文件中设置addGlobalClass属性为true即可Component({ options: { addGlob

2021-11-12 15:33:07 750

原创【微信小程序】表单提交验证及获取表单输入的值

效果图：说明：请选择房屋所在城市的效果是省市区选择器，刚开始我们可能直接在picker选择器中直接包含一个input输入框实现，但是这样的话点击选择的话可能聚焦在输入框中，我们想要的效果是点击的时候直接拉起省市区选择器。解决办法：考虑到未选择前有文字提示，我们可以用判断city变量的方法条件显示提示和选择的内容，同时为了在表单提交中可以获取到内容，可以把选择的内容同时绑定到input输入框并且把input框隐藏。<form catchsubmit="submitFn"> &l

2021-11-12 13:50:26 2171

原创【微信小程序】scroll-view实现swiper-item间距轮播效果

说明：看到效果图时，我们可能首先想到swiper组件实现，但是在实际开发中发现swiper-item的间距是无法实现的。这时我们可以用scroll-view去模拟实现。<view class="functions"> <view class="title"> 更懂国人生活方式的家装解决方案 <text class="desc">满足您的不同装修需求</text> </view> .

2021-11-11 23:31:27 1050

原创【微信小程序】基础轮播图

效果图：<view class="banner"> <swiper class="swiper" indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" circular="{{circular}}" indicator-color="rgba(0, 0, 0, .3)"

2021-11-11 23:05:16 939

原创 vue基础知识

v-if 和 v-show的区别在切换 v-if 块时，Vue.js 有一个局部编译/卸载过程，因为 v-if 之中的模板也可能包括数据绑定或子组件。v-if 是真实的条件渲染，因为它会确保条件块在切换当中合适地销毁与重建条件块内的事件监听器和子组件。v-if 也是惰性的：如果在初始渲染时条件为假，则什么也不做——在条件第一次变为真时才开始局部编译（编译会被缓存起来）。相比之下，v-show 简单得多——元素始终被编译并保留，只是简单地基于 CSS 切换。一般来说，v-if 有更高的切换消耗而 v-

2021-11-02 21:17:17 2386 2

原创 CSS3的滤镜filter属性

css3的滤镜filter属性，可以对网页中的图片进行类似Photoshop图片处理的效果，例如背景的毛玻璃效果、老照片（黑白照片）、火焰效果等。一、blur(px)高斯模糊给图像设置高斯模糊。值越大越模糊，默认是0，就是不模糊；不过，blur模糊的缺点是边缘也会模糊不清。不过，在实际的应用中，会给图像添加一个box，超出范围隐藏二、brightness(%)亮度这里写brightness(2) 跟写 brightness(200%) 效果是一样的。三、contrast(%)对比度.

2021-11-01 23:30:52 317

原创弹性布局（display:flex；）属性详解

Flexbox 是 flexible box 的简称（注：意思是“灵活的盒子容器”），是 CSS3 引入的新的布局模式。它决定了元素如何在页面上排列，使它们能在不同的屏幕尺寸和设备下可预测地展现出来。它之所以被称为 Flexbox ，是因为它能够扩展和收缩 flex 容器内的元素，以最大限度地填充可用空间。与以前布局方式（如 table 布局和浮动元素内嵌块元素）相比，Flexbox 是一个更强大的方式：在不同方向排列元素重新排列元素的显示顺序更改元素的对齐方式动态地将元素装入容器一、基.

2021-11-01 15:21:27 186