脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript技巧 → 小程序变色

微信小程序关键字变色实现代码实例

 更新时间：2019年12月13日 08:30:43   作者：星光笔  
这篇文章主要介绍了微信小程序关键字变色实现代码实例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

这篇文章主要介绍了微信小程序关键字变色实现代码实例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

1.小程序中不支持渲染indexOf使用，我们可以通过新建wps来实现

function fn(arr, arg) {
 var result = {
  indexOf: false,
  toString: ''
 }
 result.indexOf = arr.indexOf(arg) > -1;
 result.toString = arr.join(","); return result;
}
module.exports.fn = fn;

2.index.wxml

<wxs src="../indexOf.wxs" module="tools" />
<!-- tools可以自定义 -->
<view class="intro" >
<block wx:for="{微信小程序,关键字,变色}">
  <text class=" {{tools.fn(ckey, item).indexOf?'active':'black'}}">{{item}}</text>
</block>
 
</view>

引入我们的wxs，module可以自己定义，下面模板渲染中可以使用

3.index.js

const app = getApp()
 
Page({
 data: {
  keywords:['我','爱','你'],
  ckey:['我','爱']
 },
 onLoad: function () {
  console.log('代码片段是一种迷你、可分享的小程序或小游戏项目，可用于分享小程序和小游戏的开发经验、展示组件和 API 的使用、复现开发问题和 Bug 等。可点击以下链接查看代码片段的详细文档：')
  console.log('https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/devtools.html')
 },
})

小程序代码块链接：https://developers.weixin.qq.com/s/vmdBhXmA7acA

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

相关文章

  • 如何利用Proxy更优雅地处理异常详解

    如何利用Proxy更优雅地处理异常详解

    这篇文章主要给大家介绍了关于如何利用Proxy更优雅地处理异常的相关资料,文中通过实例代码以及图文介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2022-03-03
  • 另类网页中添加运行效果

    另类网页中添加运行效果

    另类网页中添加运行效果...
    2006-12-12
  • js弹出对话框方式小结

    js弹出对话框方式小结

    这篇文章主要介绍了js弹出对话框方式,结合大量实例总结分析了JavaScript常用的弹出对话框的实现技巧与相关函数的具体使用方法,需要的朋友可以参考下
    2015-11-11
  • BootstrapValidator验证用户名已存在（ajax）

    BootstrapValidator验证用户名已存在（ajax）

    这篇文章主要为大家详细介绍了BootstrapValidator验证用户名已存在，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2019-11-11
  • JavaScript实现滑块验证解锁

    JavaScript实现滑块验证解锁

    这篇文章主要为大家详细介绍了JavaScript实现滑块验证解锁，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2021-01-01
  • jQuery 名称冲突的解决方法

    jQuery 名称冲突的解决方法

    jQuery 使用 $ 符号作为 jQuery 的简介方式。某些其他 JavaScript 库中的函数（比如 Prototype）同样使用 $ 符号。
    2011-04-04
  • JavaScript中有关一个数组中最大值和最小值及它们的下表的输出的解决办法

    JavaScript中有关一个数组中最大值和最小值及它们的下表的输出的解决办法

    这篇文章主要介绍了JavaScript中有关一个数组中最大值和最小值及它们的下表的输出的一种解决办法，本文还给大家介绍了js快速获取数组中最大值和最小值的方法，非常不错,需要的朋友可以参考下
    2016-07-07
  • 获取offsetTop和offsetLeft值的js代码(兼容)

    获取offsetTop和offsetLeft值的js代码(兼容)

    offsetTop和offsetLeft的值在某些特殊的情况下是会使用到的，为了实现值的准确获取，本文采用js代码实现下，有需求的朋友可以参考下哈
    2013-04-04
  • javascript的offset、client、scroll使用方法详解

    javascript的offset、client、scroll使用方法详解

    javascript的offset、client、scroll在使用过程中非常频繁，接下来将对此进行一一介绍，需要了解的朋友可以详细参考下
    2012-12-12
  • 深度解析JavaScript中的filter()方法

    深度解析JavaScript中的filter()方法

    在JavaScript中,filter()是一个数组方法,用于从数组中过滤出符合特定条件的元素,并返回一个新数组,本文将带大家深度解析JavaScript中的filter()方法,需要的朋友可以参考下
    2023-09-09

最新评论