收藏
回答

iPhone真机运行wxss不能获取到内联设置的变量,模拟器,安卓真机就没问题

问题模块
API和组件


这里在iPhone中不能获取到margin-left的值啊!!!怎么办,那个值是动态的,但是在模拟器上就没问题,我用的0913版本,最新的基础库

最后一次编辑于  2017-09-25  (未经腾讯允许,不得转载)
邀请回答
复制链接收藏关注问题回答

13 个回答

  • SparksORCHID
    SparksORCHID
    2017-09-25

    @官方

    2017-09-25
    赞同
    回复
  • Can🌴
    Can🌴
    2017-09-25

    你好,请提供一下出现问题的机型和微信版本,以及能复现问题的简单代码示例。

    2017-09-25
    赞同
    回复
  • SparksORCHID
    SparksORCHID
    2017-09-25

    wxml

    <view class="marquee_container" style="--marqueeWidth--:{{-marquee.width}}em">
        <view class="marquee_text">{{marquee.text}}</view>

    </view>

    --marqueeWidth是给@keyframes传的变量


    wxss:

    @keyframes around {

    from {

    margin-left: 100%;

    }

    to {

    margin-left: var(--marqueeWidth--);

    }

    }

    .marquee_container {

    background-color: #0099FF;

    font-size: 30rpx;

    height: 2.2em;

    position: relative;

    width: 424rpx;

    margin-top: 55rpx;

    overflow: hidden;

    }


    .marquee_text {

    position: relative;

    width: 100%;

    height: 2.2em;

    display: inline-block;

    white-space: nowrap;

    animation-name: around;

    animation-duration: 5s;

    animation-iteration-count: infinite;

    animation-timing-function: linear;

    }


    .js

    data:{

    // 文字滚动

    marquee: { text: '哈哈哈哈哈哈哈哈!2哈哈哈哈哈哈哈!3哈哈哈哈哈哈哈哈哈哈哈哈!' },

    // 文字滚动

    }

    // 文字滚动

    getWidth: (str) => {

    return [].reduce.call(str, (pre, cur, index, arr) => {

    if (str.charCodeAt(index) > 255) {// charCode大于255是汉字

    pre++;

    } else {

    pre += 0.5;

    }

    return pre;

    }, 0);

    },

    getDuration: (str) => {// 保留,根据文字长度设置时间

    return this.getWidth() / 10;

    },

    // 文字滚动

    onLoad: function () {


    // 文字滚动

    const str = this.data.marquee.text;

    const width = this.getWidth(str);

    // console.log('width', width);

    this.setData({

    [`${'marquee'}.width`]: width

    });

    // 文字滚动

    },


    2017-09-25
    赞同
    回复
  • SparksORCHID
    SparksORCHID
    2017-09-25

    机型的话,iPhone真机测试了5s,6s都不行,安卓没问题,问题应该在@keyframes这里的变量获取不到,微信版本是6.5.13

    2017-09-25
    赞同
    回复
  • SparksORCHID
    SparksORCHID
    2017-09-25

    @Can🌴

    你试试吧,直接粘贴就行 官方

    2017-09-25
    赞同
    回复
  • SparksORCHID
    SparksORCHID
    2017-09-25

    data后面少个逗号,麻烦自己加一下....

    2017-09-25
    赞同
    回复
  • SparksORCHID
    SparksORCHID
    2017-09-25

    iPhone版本是6.5.16的,安卓是6.5.13

    2017-09-25
    赞同
    回复
  • Can🌴
    Can🌴
    2017-09-25

    请问你 ios 版本是多少?

    2017-09-25
    赞同
    回复
  • SparksORCHID
    SparksORCHID
    2017-09-25

    6s版本是11,5s版本是10.3.2

    @Can🌴

    2017-09-25
    赞同
    回复
  • Can🌴
    Can🌴
    2017-09-25

    单独使用 css var 和单独使用 @keyframes 都是正常的

    同时使用,我这边试是会有问题。

    还有 css var 在 ios 9.x 是不支持的。

    2017-09-25
    赞同
    回复