小程序
小游戏
企业微信
微信支付
扫描小程序码分享
previous-margin 设置无效，但next-margin有效果。如图：
3 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
swiper-item不要设置width
你好，麻烦通过点击下方“反馈信息”按钮，提供出现问题的。
父组件wxml
<view class"subBanner">
bannerprevious-margin"30rpx"next-margin"{{nextMargin}}"autoplay"{{true}}"></banner
</view
父组件js
const app = getApp()
Page({
data: {
url: http.url, // url初始化
imgUrls: [], // 轮播图路径
perviousMargin: '30rpx', // 轮播图当前个距离左边的距离
nextMargin: '30rpx', // 轮播图当前个距离右边的距离
indicatorDots: false, // 轮播图去掉默认项目导航
subCurrentIndex: // 轮播图当前个下标
},
})
子组件wxml
viewclass"banner">
swiperindicator-dots"{{true}}"autoplay"{{false}}"interval"{{false}}"duration"300"current"0"circular"true"previous-margin"{{perviousMargin}}"next-margin"{{nextMargin}}">
blockwx:for"{{imgUrls}}"wx:key"banner">
swiper-item
imagesrc"{{url+item.previewUrl}}"class"slide-image"></image
</swiper-item
</block
</swiper
</view>
子组件js
const http = require('../../utils/http'
Component({
options:{
multipleSlots: true, // 在组件使用插槽slot并支持多个插槽
addGlobalClass: true// 组件的样式可以在全局进行修改
/*组件的属性列表*/
properties:{
indicatorDots:{
type:Boolean
value:true
autoplay:{
value:false
currentIndex:{
type:Number
value:
imgUrls:{
type:Array
value:[]
circular:{
perviousMargin:{
type:String
value:'0'
nextMargin:{
url:{
value:http.url
interval:{
value:300
duration:{
value:500
}
methods:{
getSubBannerURL: function () {
http.get({
url: 'webapp/websiteImages'
success: res => {
this.setData({
imgUrls: res.data.entity.type_1
this.triggerEvent('setSubImgUrl', {
/*
组件生命周期函数，在组件实例进入页面节点树时执行
attached只执行与一次 不会重新渲染
*/
attached: function () {
this.getSubBannerURL()
你好，这边测试是正常的，请提供能复现问题的简单代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html）
这个就别在要代码片段了，我这里也一样的问题，就是最基础的swiper，机型iphonex
用这个代码片段能复现问题吗？https://developers.weixin.qq.com/s/RvcrLOmJ7T6i
这边测试是有效的，iOS版本和微信版本是什么？
ok，我这里的问题，一段样式写错了。。。
我的也是设置无效 你这个代码片段怎么打不开 没有代码
有内容的，是不是开发工具版本太旧了，更新一下开发工具试试
关注后，可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
swiper-item不要设置width
父组件wxml
<view class"subBanner">
bannerprevious-margin"30rpx"next-margin"{{nextMargin}}"autoplay"{{true}}"></banner
</view
父组件js
const app = getApp()
Page({
data: {
url: http.url, // url初始化
imgUrls: [], // 轮播图路径
perviousMargin: '30rpx', // 轮播图当前个距离左边的距离
nextMargin: '30rpx', // 轮播图当前个距离右边的距离
indicatorDots: false, // 轮播图去掉默认项目导航
subCurrentIndex: // 轮播图当前个下标
},
})
子组件wxml
viewclass"banner">
swiperindicator-dots"{{true}}"autoplay"{{false}}"interval"{{false}}"duration"300"current"0"circular"true"previous-margin"{{perviousMargin}}"next-margin"{{nextMargin}}">
blockwx:for"{{imgUrls}}"wx:key"banner">
swiper-item
imagesrc"{{url+item.previewUrl}}"class"slide-image"></image
</swiper-item
</block
</swiper
</view>
子组件js
const http = require('../../utils/http'
Component({
options:{
multipleSlots: true, // 在组件使用插槽slot并支持多个插槽
addGlobalClass: true// 组件的样式可以在全局进行修改
},
/*组件的属性列表*/
properties:{
indicatorDots:{
type:Boolean
value:true
},
autoplay:{
type:Boolean
value:false
},
currentIndex:{
type:Number
value:
},
imgUrls:{
type:Array
value:[]
},
circular:{
type:Boolean
value:false
},
perviousMargin:{
type:String
value:'0'
},
nextMargin:{
type:String
value:'0'
},
url:{
type:String
value:http.url
},
interval:{
type:Number
value:300
},
duration:{
type:Number
value:500
}
},
methods:{
getSubBannerURL: function () {
http.get({
url: 'webapp/websiteImages'
success: res => {
this.setData({
imgUrls: res.data.entity.type_1
})
this.triggerEvent('setSubImgUrl', {
imgUrls: res.data.entity.type_1
})
}
})
},
},
/*
组件生命周期函数，在组件实例进入页面节点树时执行
attached只执行与一次 不会重新渲染
*/
attached: function () {
this.getSubBannerURL()
}
})
你好，这边测试是正常的，请提供能复现问题的简单代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html）
这个就别在要代码片段了，我这里也一样的问题，就是最基础的swiper，机型iphonex
用这个代码片段能复现问题吗？https://developers.weixin.qq.com/s/RvcrLOmJ7T6i
这边测试是有效的，iOS版本和微信版本是什么？
ok，我这里的问题，一段样式写错了。。。
我的也是设置无效 你这个代码片段怎么打不开 没有代码
有内容的，是不是开发工具版本太旧了，更新一下开发工具试试