微信小程序接龙

微信小程序接龙是一种流行的小程序互动游戏，通常用于社交场合或团队活动。它可以帮助用户更好地参与和互动，增加乐趣。以下是一个简单的微信小程序接龙示例：

1. 创建一个新的微信小程序项目，并在pages/index/index.wxml文件中添加以下代码：

<view class="container">
  <view class="title">接龙游戏</view>
  <view class="content">
    <input class="input" type="text" value="{{word}}" bindinput="onInput" placeholder="请输入接龙词语" />
    <button class="submit" bindtap="submitWord">提交</button>
    <view wx:for="{{words}}" wx:key="index" class="word">{{item}}</view>
  </view>
</view>

2. 在pages/index/index.wxss文件中添加以下样式：

.container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100vh;
}

.title {
  font-size: 24px;
  margin-bottom: 20px;
}

.content {
  width: 80%;
  margin-bottom: 20px;
}

.input {
  width: 100%;
  height: 40px;
  border: 1px solid #ccc;
  border-radius: 4px;
  padding: 0 10px;
}

.submit {
  width: 100%;
  height: 40px;
  background-color: #1aad19;
  color: #fff;
  border-radius: 4px;
  margin-top: 10px;
}

.word {
  margin-bottom: 10px;
  padding: 5px 10px;
  background-color: #f5f5f5;
  border-radius: 4px;
}

3. 在pages/index/index.js文件中添加以下逻辑：

Page({
  data: {
    word: "",
    words: []
  },

  onInput(event) {
    this.setData({
      word: event.detail.value
    });
  },

  submitWord() {
    if (this.data.word === "") {
      wx.showToast({
        title: "请输入接龙词语",
        icon: "none"
      });
      return;
    }

    if (this.data.words.includes(this.data.word)) {
      wx.showToast({
        title: "已存在该词语，请重新输入",
        icon: "none"
      });
      return;
    }

    this.setData({
      words: [...this.data.words, this.data.word]
    });

    this.setData({
      word: ""
    });
  }
});

现在你已经完成了一个简单的微信小程序接龙游戏。用户可以在输入框中输入接龙词语，然后点击提交按钮将词语添加到列表中。如果用户输入的词语已经存在于列表中，将会提示重新输入。游戏可以继续进行，直到用户不想玩了为止。