Skip to content

Commit

Permalink
fix: 修复微信小程序中关于form，backtop，checkbox和radio的多个问题
Browse files Browse the repository at this point in the history
  • Loading branch information
@wlxuqu
wlxuqu committed Nov 30, 2021
1 parent 0cd88cf commit cff0919
Show file tree
Hide file tree
Showing 14 changed files with 178 additions and 178 deletions.
16 changes: 1 addition & 15 deletions common/demo.scss
View file
Original file line number Diff line number Diff line change
@@ -1,12 +1,3 @@
.u-view {
padding: 40px 20px 0px 20px;
&__title {
font-size: 14px;
color: rgb(143, 156, 162);
margin-bottom: 10px;
}
}

.u-block{
padding: 14px;
&__section{
Expand Down Expand Up @@ -41,12 +32,7 @@
margin-bottom: 23px;

&__content {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
// flex-direction: row!important;
// align-items: center;
// flex-wrap: wrap;
@include flex(column);
}

&__title {
Expand Down
262 changes: 131 additions & 131 deletions pages/componentsA/backtop/backtop.nvue
View file
Original file line number Diff line number Diff line change
@@ -1,132 +1,132 @@
<template>
<view
class="u-page"
ref="u-back-top"
>
<view class="u-demo-block">
<text class="u-demo-block__title">自定义backTop(滚动页面即可在右下角看到图标)</text>
<view class="u-demo-block__content">
<view class="u-page__backTop-item">
<u-checkbox-group
placement="column"
shape="square"
@change="checkboxChange"
:value="['自定义图标']"
>
<u-checkbox
:customStyle="{marginBottom: '8px'}"
v-for="(item, index) in checkboxList"
:key="index"
:label="item.name"
:name="item.name"
>
</u-checkbox>
</u-checkbox-group>
</view>
</view>
</view>
<u-back-top
:right="backTopData.right"
:customStyle="backTopData.customStyle"
:bottom="backTopData.bottom"
:icon="backTopData.icon"
:mode="backTopData.mode"
:iconStyle="backTopData.iconStyle"
:duration="backTopData.duration"
:scrollTop="scrollTop"
@click="click"
></u-back-top>
</view>
</template>

<script>
// const dom = weex.requireModule('dom')
export default {
data() {
<template>
<view
class="u-page"
ref="u-back-top"
>
<view class="u-demo-block">
<text class="u-demo-block__title">自定义backTop(滚动页面即可在右下角看到图标)</text>
<view class="u-demo-block__content">
<view class="u-page__backTop-item">
<u-checkbox-group
placement="column"
shape="square"
@change="checkboxChange"
v-model="value"
>
<u-checkbox
:customStyle="{marginBottom: '8px'}"
v-for="(item, index) in checkboxList"
:key="index"
:label="item.name"
:name="item.name"
>
</u-checkbox>
</u-checkbox-group>
</view>
</view>
</view>
<u-back-top
:right="backTopData.right"
:customStyle="backTopData.customStyle"
:bottom="backTopData.bottom"
:icon="backTopData.icon"
:mode="backTopData.mode"
:iconStyle="backTopData.iconStyle"
:duration="backTopData.duration"
:scrollTop="scrollTop"
@click="click"
></u-back-top>
</view>
</template>

<script>
export default {
data() {
return {
backTopData: {
mode: 'circle',
icon: 'arrow-upward',
bottom: 100,
customStyle: {},
iconStyle: {},
right:20,
duration: 300
},
scrollTop: 0,
// 被自定义的样式
checkboxList: [{
name: '显示方形',
},
{
name: '自定义图标',
},
{
name: '自定义距离',
},
{
name: '自定义样式',
},
{
name:'自定义返回顶部滚动时间',
}
]
}
},
onLoad() {
// 演示中默认勾选了自定义图标
this.backTopData.icon = "arrow-up"
},
onPageScroll(e) {
this.scrollTop = e.scrollTop;
},
methods: {
checkboxChange(n) {
if (n.includes('显示方形')) {
this.backTopData.mode = 'square'
} else {
this.backTopData.mode = "circle"
}
if (n.includes('自定义图标')) {
this.backTopData.icon = "arrow-up"
} else {
this.backTopData.icon = "arrow-upward"
}
if (n.includes('自定义距离')) {
this.backTopData.bottom = 300
this.backTopData.right=20
} else {
this.backTopData.bottom = 100
}
if (n.includes('自定义样式')) {
this.backTopData.customStyle = {
backgroundColor: '#2979ff',
}
this.backTopData.iconStyle = {
color: '#ffffff'
}
} else {
this.backTopData.customStyle = {}
this.backTopData.iconStyle = {}
}
if (n.includes('自定义返回顶部滚动时间')) {
this.backTopData.duration =1500
} else {
this.backTopData.duration =300
}
},
click() {
console.log('click');
}
}
}
</script>

<style lang="scss">
.u-page {
height: 1200px;
&__backTop-item{
margin-top:10px;
}
}
</style>
value: ['自定义图标'],
backTopData: {
mode: 'circle',
icon: 'arrow-upward',
bottom: 100,
customStyle: {},
iconStyle: {},
right:20,
duration: 300
},
scrollTop: 0,
// 被自定义的样式
checkboxList: [{
name: '显示方形',
},
{
name: '自定义图标',
},
{
name: '自定义距离',
},
{
name: '自定义样式',
},
{
name:'自定义返回顶部滚动时间',
}
]
}
},
onLoad() {
// 演示中默认勾选了自定义图标
this.backTopData.icon = "arrow-up"
},
onPageScroll(e) {
this.scrollTop = e.scrollTop;
},
methods: {
checkboxChange(n) {
if (n.includes('显示方形')) {
this.backTopData.mode = 'square'
} else {
this.backTopData.mode = "circle"
}
if (n.includes('自定义图标')) {
this.backTopData.icon = "arrow-up"
} else {
this.backTopData.icon = "arrow-upward"
}
if (n.includes('自定义距离')) {
this.backTopData.bottom = 300
this.backTopData.right=20
} else {
this.backTopData.bottom = 100
}
if (n.includes('自定义样式')) {
this.backTopData.customStyle = {
backgroundColor: '#2979ff',
}
this.backTopData.iconStyle = {
color: '#ffffff'
}
} else {
this.backTopData.customStyle = {}
this.backTopData.iconStyle = {}
}
if (n.includes('自定义返回顶部滚动时间')) {
this.backTopData.duration =1500
} else {
this.backTopData.duration =300
}
},
click() {
console.log('click');
}
}
}
</script>

<style lang="scss">
.u-page {
height: 1200px;
&__backTop-item{
margin-top:10px;
}
}
</style>
3 changes: 0 additions & 3 deletions pages/componentsA/checkbox/checkbox.nvue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -315,9 +315,6 @@
checkboxValue1(newValue, oldValue) {
// console.log('v-model', newValue);
}
},
onLoad() {

},
methods: {
checkboxChange(n) {
Expand Down
3 changes: 0 additions & 3 deletions pages/componentsA/radio/radio.nvue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -300,9 +300,6 @@
radiovalue1(newValue, oldValue) {
console.log('v-model', newValue);
}
},
onLoad() {

},
methods: {
groupChange(n) {
Expand Down
Loading

0 comments on commit cff0919

Please sign in to comment.