微信小程序九宫格图片实现代码

以下是微信小程序九宫格图片实现代码：

<view class="grid-container">
  <view class="grid-item" wx:for="{{images}}" wx:key="{{index}}">
    <image src="{{item.src}}" mode="aspectFill"></image>
  </view>
</view>

.grid-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 10px;
}

.grid-item {
  width: 32%;
  margin-bottom: 10px;
}

.grid-item:nth-child(3n+1) {
  margin-right: 2%;
}

.grid-item:nth-child(3n+2) {
  margin-right: 2%;
  margin-left: 2%;
}

.grid-item:nth-child(3n+3) {
  margin-left: 2%;
}

Page({
  data: {
    images: [
      { src: 'https://example.com/image1.jpg' },
      { src: 'https://example.com/image2.jpg' },
      { src: 'https://example.com/image3.jpg' },
      { src: 'https://example.com/image4.jpg' },
      { src: 'https://example.com/image5.jpg' },
      { src: 'https://example.com/image6.jpg' },
      { src: 'https://example.com/image7.jpg' },
      { src: 'https://example.com/image8.jpg' },
      { src: 'https://example.com/image9.jpg' },
    ]
  }
})

你可以将上述代码拷贝到你的微信小程序页面中，然后将图片链接替换为你自己的图片链接即可。