![\"\u8bf7\u6dfb\u52a0\u56fe\u7247\u63cf\u8ff0\"](\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/05\/20250430220239-68129dff8de5b.gif\")
<\/p>\n<\/p>\n
<view class="container">
\n <view class="container-num" wx:for="{{number}}" wx:key="index">
\n <view class="num-container" style="–h:{{h}}px;–y:{{-item * h }}px;">
\n <view wx:for="{{10}}" wx:key="index" class="num-item">
\n {{index}}
\n <\/view>
\n <\/view>
\n <\/view>
\n<\/view>
\n<button bind:tap="getRandomNum">\u751f\u6210\u968f\u673a\u6570<\/button><\/p>\n
Page({
\n data: {
\n number:'0',
\n h:30,
\n },
\n getRandomNum(){
\n const num = `${Math.floor(Math.random() * 1000)}`;
\n this.setData({
\n number:num
\n })
\n }
\n})<\/p>\n
.container{
\n padding: 100rpx 0;
\n display: flex;
\n justify-content: center;
\n}
\n.container-num{
\n overflow: hidden;
\n}
\n.num-container{
\n height: var(–h);
\n transform:translateY(var(–y));
\n transition-duration: 1s;
\n margin: 0 1px;
\n}
\n.num-item{
\n height: var(–h);
\n flex-direction: column;
\n display: flex;
\n align-items: center;
\n justify-content: center;
\n}<\/p>\n
\u9047\u5230\u95ee\u9898\u53ef\u4ee5\u770b\u6211\u4e3b\u9875\u52a0\u6211Q，\u5f88\u5c11\u770b\u535a\u5ba2，\u5bf9\u4f60\u6709\u5e2e\u52a9\u522b\u5fd8\u8bb0\u70b9\u8d5e\u6536\u85cf\u3002<\/p>\n","protected":false},"excerpt":{"rendered":"
\u6587\u7ae0\u6d4f\u89c8\u9605\u8bfb1.2k\u6b21\u3002\u6570\u5b57\u6eda\u52a8\u6548\u679c\u6709\u6548\u679c\u56fe<\/p>\n","protected":false},"author":2,"featured_media":34809,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[573,555],"topic":[],"class_list":["post-34810","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-server","tag-css","tag-555"],"yoast_head":"\n