{"id":30309,"date":"2024-11-25T08:55:00","date_gmt":"2024-11-25T00:55:00","guid":{"rendered":"https:\/\/fwq.ai\/blog\/30309\/"},"modified":"2024-11-25T08:55:00","modified_gmt":"2024-11-25T00:55:00","slug":"%e5%b0%8f%e7%a8%8b%e5%ba%8f%e5%bc%80%e5%8f%91%e4%b9%8b%e5%ae%9e%e7%8e%b0%e6%a5%bc%e5%b1%82%e9%94%9a%e7%82%b9%e8%b7%b3%e8%b7%83%e5%ae%9e%e4%be%8b%e8%af%a6%e8%a7%a3","status":"publish","type":"post","link":"https:\/\/fwq.ai\/blog\/30309\/","title":{"rendered":"\u5c0f\u7a0b\u5e8f\u5f00\u53d1\u4e4b\u5b9e\u73b0\u697c\u5c42\u951a\u70b9\u8df3\u8dc3\u5b9e\u4f8b\u8be6\u89e3"},"content":{"rendered":"

\u8fd9\u7bc7\u6587\u7ae0\u4e3b\u8981\u4ecb\u7ecd\u4e86\u5fae\u4fe1\u5c0f\u7a0b\u5e8f\u5b9e\u73b0\u5b9a\u4f4d\u697c\u5c42\u8df3\u8dc3\u7684\u5b9e\u4f8b\u7684\u76f8\u5173\u8d44\u6599,\u9700\u8981\u7684\u670b\u53cb\u53ef\u4ee5\u53c2\u8003\u4e0b<\/p>\n

\u5fae\u4fe1\u5c0f\u7a0b\u5e8f\u5b9e\u73b0\u697c\u5c42\u951a\u70b9\u8df3\u8dc3\uff0c\u70b9\u51fb\u4e0d\u540c\u7684\u951a\u70b9\u8fdb\u884c\u4f4d\u7f6e\u8df3\u8dc3\uff1a <\/strong><\/p>\n

\u5229\u7528\uff1ascroll-into-view \u6765\u5b9e\u73b0<\/strong><\/p>\n

\u6548\u679c\u56fe\u5982\u4e0b\uff1a<\/p>\n

\"\u5c0f\u7a0b\u5e8f\u5f00\u53d1\u4e4b\u5b9e\u73b0\u697c\u5c42\u951a\u70b9\u8df3\u8dc3\u5b9e\u4f8b\u8be6\u89e3\u63d2\u56fe\"<\/p>\n

WXML:<\/strong><\/p>\n

<scroll-view> \r\n <view> \r\n  <view>{{item.region}}<\/view> \r\n  <view> \r\n   <view>{{item.name}}<\/view> \r\n  <\/view> \r\n <\/view> \r\n<\/scroll-view> \r\n<view> \r\n <view>\u81ea\u52a8\u5b9a\u4f4d<\/view> \r\n <block> \r\n  <view>{{item.region}}<\/view> \r\n <\/block> \r\n<\/view><\/pre>\n
 \u767b\u5f55\u540e\u590d\u5236 <\/p>\n
:<\/strong><\/p>\n
page{ height: 100%;} \r\n.content{padding-bottom: 20rpx; box-sizing: border-box; height: 100%;} \r\n.location{width: 100%;} \r\n.location_top{height: 76rpx;line-height: 76rpx; background: #f4f4f4;color: #606660;font-size: 28rpx;padding: 0 20rpx;} \r\n.location_bottom{height: 140rpx;line-height: 140rpx;color: #d91f16;font-size: 28rpx;border-top: 2rpx #ebebeb solid; border-bottom: 2rpx #ebebeb solid;padding: 0 20rpx; align-items: center;display: -webkit-flex;} \r\n.address_top{height: 76rpx;line-height: 76rpx; background: #f4f4f4;color: #999999;font-size: 28rpx;padding: 0 20rpx;} \r\n.address_bottom{height: 88rpx;line-height: 88rpx; background: #fff;color: #000000;font-size: 32rpx;padding: 0 20rpx; border-bottom: 2rpx #ebebeb solid;margin-left: 20rpx;margin-right: 50rpx; } \r\n.location_img{width: 48rpx;height: 48rpx;position: absolute;right: 20rpx;top: 125rpx;} \r\n.add_city{width: 228rpx;height: 60rpx;line-height: 60rpx; text-align: center; border: 2rpx solid #ebebeb; color: #000000;margin-right: 20rpx; } \r\n.add_citying{width: 228rpx;height: 60rpx;line-height: 60rpx; text-align: center; border: 2rpx solid #09bb07; color: #09bb07;margin-right: 20rpx;} \r\n.orientation{white-space:normal;display: inline-block; width: 55rpx;height:58rpx; color: #999; text-align: center;} \r\n.orientation_region{ width: 55rpx;font-size: 20rpx;position: fixed;top: 220rpx; right: 0rpx;} \r\n.orientation_city{height: 50rpx; line-height: 50rpx;color: #000;text-align: center;}<\/pre>\n
 \u767b\u5f55\u540e\u590d\u5236 <\/p>\n
JS:<\/strong><\/p>\n
Page({ \r\n \/** \r\n  * \u9875\u9762\u7684\u521d\u59cb\u6570\u636e \r\n  *\/ \r\n data: { \r\n  orientationList: [ \r\n   { id: \"01\", region: \"\u4e1c\u5317\" }, \r\n   { id: \"02\", region: \"\u534e\u5317\" }, \r\n   { id: \"03\", region: \"\u534e\u4e1c\" }, \r\n   { id: \"04\", region: \"\u534e\u5357\" }, \r\n   { id: \"05\", region: \"\u534e\u4e2d\" }, \r\n   { id: \"06\", region: \"\u897f\u5317\" }, \r\n   { id: \"07\", region: \"\u897f\u5357\" } \r\n  ], \r\n  act_addList: [ \r\n   { \r\n    id: \"01\", region: \"\u4e1c\u5317\u5730\u533a\", \r\n    city: [{ id: \"0101\", name: \"\u767d\u5c71\u6c5f\u6e90\" }, \r\n    { id: \"0102\", name: \"\u767d\u5c71\u5e02\" }, \r\n    { id: \"0103\", name: \"\u5bbe\u53bf\" }, \r\n    { id: \"0104\", name: \"\u5927\u5e86\" }, \r\n    { id: \"0105\", name: \"\u6d4b\u8bd51\" }, \r\n    { id: \"0106\", name: \"\u6d4b\u8bd52\" }, \r\n    { id: \"0107\", name: \"\u6d4b\u8bd53\" }, \r\n    { id: \"0108\", name: \"\u6d4b\u8bd54\" }, \r\n    { id: \"0109\", name: \"\u6d4b\u8bd55\" }, \r\n    { id: \"0110\", name: \"\u6d4b\u8bd56\" }, \r\n    ] \r\n   }, \r\n   { \r\n    id: \"02\", region: \"\u534e\u5317\u5730\u533a\", \r\n    city: [{ id: \"0201\", name: \"\u5305\u5934\" }, \r\n    { id: \"0202\", name: \"\u4fdd\u5b9a\" }, \r\n    { id: \"0206\", name: \"\u6d4b\u8bd52\" }, \r\n    { id: \"0207\", name: \"\u6d4b\u8bd53\" }, \r\n    { id: \"0208\", name: \"\u6d4b\u8bd54\" }, \r\n    { id: \"0209\", name: \"\u6d4b\u8bd55\" }, \r\n    { id: \"0210\", name: \"\u6d4b\u8bd56\" }, \r\n    ] \r\n   }, \r\n   { \r\n    id: \"03\", region: \"\u534e\u4e1c\u5730\u533a\", \r\n    city: [{ id: \"0303\", name: \"\u5f00\u5c01\u5e02\" }, \r\n    { id: \"3104\", name: \"\u5b89\u9633\u5e02\" },] \r\n   }, \r\n   { \r\n    id: \"04\", region: \"\u534e\u5357\u5730\u533a\", \r\n    city: [ \r\n     { id: \"0401\", name: \"\u9ed1\u9f99\u6c5f\u5e02\" }, \r\n     { id: \"0407\", name: \"\u6d4b\u8bd53\" }, \r\n     { id: \"0508\", name: \"\u6d4b\u8bd54\" }, \r\n     { id: \"0609\", name: \"\u6d4b\u8bd55\" }, \r\n     { id: \"0710\", name: \"\u6d4b\u8bd56\" }, \r\n     { id: \"0711\", name: \"\u6d4b\u8bd58\" }, \r\n     { id: \"0712\", name: \"\u6d4b\u8bd59\" }, \r\n     { id: \"0713\", name: \"\u6d4b\u8bd510\" }, \r\n     { id: \"0714\", name: \"\u6d4b\u8bd511\" }, \r\n    ] \r\n   }, \r\n   { id: \"05\", region: \"\u534e\u4e2d\u5730\u533a\", city: [{ id: \"0501\", name: \"\u9ed1\u9f99\u6c5f\u5e02\" }] }, \r\n   { \r\n    id: \"06\", region: \"\u897f\u5317\u5730\u533a\", \r\n    city: [{ id: \"0603\", name: \"\u5f00\u5c01\u5e02\" }, \r\n    { id: \"0604\", name: \"\u5b89\u9633\u5e02\" },] \r\n   }, \r\n   { \r\n    id: \"07\", region: \"\u897f\u5357\u5730\u533a\", \r\n    city: [{ id: \"0703\", name: \"\u5f00\u5c01\u5e02\" }, \r\n    { id: \"0704\", name: \"\u5b89\u9633\u5e02\" }, \r\n    { id: \"0401\", name: \"\u9ed1\u9f99\u6c5f\u5e02\" }, \r\n    { id: \"0407\", name: \"\u6d4b\u8bd53\" }, \r\n    { id: \"0508\", name: \"\u6d4b\u8bd54\" }, \r\n    { id: \"0609\", name: \"\u6d4b\u8bd55\" }, \r\n    { id: \"0710\", name: \"\u6d4b\u8bd56\" }, \r\n    { id: \"0711\", name: \"\u6d4b\u8bd58\" }, \r\n    { id: \"0712\", name: \"\u6d4b\u8bd59\" }, \r\n    { id: \"0713\", name: \"\u6d4b\u8bd510\" }, \r\n    { id: \"0714\", name: \"\u6d4b\u8bd511\" }, \r\n    { id: \"0401\", name: \"\u9ed1\u9f99\u6c5f\u5e02\" }, \r\n    { id: \"0407\", name: \"\u6d4b\u8bd53\" }, \r\n    { id: \"0508\", name: \"\u6d4b\u8bd54\" }, \r\n    { id: \"0609\", name: \"\u6d4b\u8bd55\" }, \r\n    { id: \"0710\", name: \"\u6d4b\u8bd56\" }, \r\n    { id: \"0711\", name: \"\u6d4b\u8bd58\" }, \r\n    { id: \"0712\", name: \"\u6d4b\u8bd59\" }, \r\n    { id: \"0713\", name: \"\u6d4b\u8bd510\" }, \r\n    { id: \"0714\", name: \"\u6d4b\u8bd511\" }, \r\n    ] \r\n   }, \r\n  ], \r\n  toView: 'inToView01', \r\n }, \r\n scrollToViewFn: function (e) { \r\n  var _id = e.target.dataset.id; \r\n  this.setData({ \r\n   toView: 'inToView' + _id \r\n  }) \r\n  console.log(this.data.toView) \r\n }, \r\n onLoad: function (options) { \r\n } \r\n})<\/pre>\n
 \u767b\u5f55\u540e\u590d\u5236 <\/p>\n
\u3010\u76f8\u5173\u63a8\u8350\u3011<\/p>\n
1. <\/p>\n
2. <\/p>\n
3. <\/p>\n
\u4ee5\u4e0a\u5c31\u662f\u5c0f\u7a0b\u5e8f\u5f00\u53d1\u4e4b\u5b9e\u73b0\u697c\u5c42\u951a\u70b9\u8df3\u8dc3\u5b9e\u4f8b\u8be6\u89e3\u7684\u8be6\u7ec6\u5185\u5bb9\uff0c\u66f4\u591a\u8bf7\u5173\u6ce8\u7c73\u4e91\u5176\u5b83\u76f8\u5173\u6587\u7ae0\uff01<\/p>\n","protected":false},"excerpt":{"rendered":"
\u8fd9\u7bc7\u6587\u7ae0\u4e3b\u8981\u4ecb\u7ecd\u4e86\u5fae\u4fe1\u5c0f\u7a0b\u5e8f\u5b9e\u73b0\u5b9a\u4f4d\u697c\u5c42\u8df3\u8dc3\u7684\u5b9e\u4f8b\u7684\u76f8\u5173\u8d44\u6599,\u9700\u8981\u7684\u670b\u53cb\u53ef\u4ee5\u53c2\u8003\u4e0b \u5fae\u4fe1\u5c0f\u7a0b\u5e8f\u5b9e\u73b0\u697c\u5c42\u951a\u70b9\u8df3\u8dc3\uff0c\u70b9\u51fb\u4e0d\u540c\u7684\u951a\u70b9\u8fdb\u884c\u4f4d\u7f6e\u8df3\u8dc3\uff1a \u5229\u7528\uff1ascroll-into-view \u6765\u5b9e\u73b0 \u6548\u679c\u56fe\u5982\u4e0b\uff1a WXML: <scroll-view>   <view>    <view>{{item.region}}<\/view>    <view>     <view>{{item.name}}<\/view>    <\/view>   <\/view>  <\/scroll-view>  <view>   <view>\u81ea\u52a8\u5b9a\u4f4d<\/view>   <block>    <view>{{item.region}}<\/view>   <\/block>  <\/view> \u767b\u5f55\u540e\u590d\u5236 : page{ height: 100%;}  .content{padding-bottom: 20rpx; box-sizing: border-box; height: 100%;}  .location{width: 100%;}  .location_top{height: 76rpx;line-height: 76rpx; background: #f4f4f4;color: #606660;font-size: 28rpx;padding: 0 20rpx;}  .location_bottom{height: 140rpx;line-height: 140rpx;color: #d91f16;font-size: 28rpx;border-top: 2rpx #ebebeb solid; border-bottom: 2rpx #ebebeb solid;padding: 0 20rpx; align-items: center;display: -webkit-flex;}  .address_top{height: 76rpx;line-height: 76rpx; background: #f4f4f4;color: #999999;font-size: 28rpx;padding: 0 20rpx;}  .address_bottom{height: 88rpx;line-height: 88rpx; background: #fff;color: #000000;font-size: 32rpx;padding: 0 20rpx; border-bottom: 2rpx #ebebeb solid;margin-left: 20rpx;margin-right: 50rpx; }  .location_img{width: 48rpx;height: 48rpx;position: absolute;right: 20rpx;top: 125rpx;}  .add_city{width: 228rpx;height: 60rpx;line-height: 60rpx; text-align: center; border: 2rpx solid #ebebeb; color: #000000;margin-right: 20rpx; }  .add_citying{width: 228rpx;height: 60rpx;line-height: 60rpx; text-align: center; border: 2rpx solid #09bb07; color: #09bb07;margin-right: 20rpx;}  .orientation{white-space:normal;display: inline-block; width: 55rpx;height:58rpx; color: #999; text-align: center;}  .orientation_region{ width: 55rpx;font-size: 20rpx;position: fixed;top: 220rpx; right: 0rpx;}  .orientation_city{height: 50rpx; line-height: 50rpx;color: #000;text-align: center;} \u767b\u5f55\u540e\u590d\u5236 JS: Page({   \/**    * \u9875\u9762\u7684\u521d\u59cb\u6570\u636e    *\/   data: {    orientationList: [     { id: “01”, region: “\u4e1c\u5317” },     { id: “02”, region: “\u534e\u5317” },     { id: “03”, region: “\u534e\u4e1c” },     { id: “04”, region: “\u534e\u5357” },     { id: “05”, region: “\u534e\u4e2d” },     { id: “06”, region: “\u897f\u5317” },     { id: “07”, region: “\u897f\u5357” }    ],    act_addList: [     {      id: “01”, region: “\u4e1c\u5317\u5730\u533a”,      city: [{ id: “0101”, name: “\u767d\u5c71\u6c5f\u6e90” },  […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[19],"tags":[],"class_list":["post-30309","post","type-post","status-publish","format-standard","hentry","category-19"],"_links":{"self":[{"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/posts\/30309","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/comments?post=30309"}],"version-history":[{"count":0,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/posts\/30309\/revisions"}],"wp:attachment":[{"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/media?parent=30309"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/categories?post=30309"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/tags?post=30309"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}