文章目录
项目代码见文字底部，点赞关注有惊喜
小程序首页采用引导页展示漫画和文字，提高了用户的使用体验感
引导页使用scroll-view组件实现
核心代码如下
<view class="page">
<!--黑屏-->
<view style="position: absolute; z-index: 2;height: {{height}}px;width:100%;background-color: black;display: {{displayMask}};opacity: 0.95;" bindtap="eventHandle">
<view style="margin-top: 500rpx;">
<view animation="{{animationData}}" style="height:130rpx;width:750rpx;">
<view style="text-align: center;color: white;padding-left:24rpx; font-size: 150%"> 省电！节能！你想过吗？</view>
<view class="trans-fadeout" style="text-align: center;color: white;margin-top:50rpx;opacity: {{opacity}}">轻触屏幕，检视用电</view>
<image src="../../public/image/touch.png" style="width: 50px; height: 50px; margin-left: 160px;margin-top: 100px;"></image>
</view>
</view>
</view>
<scroll-view scroll-y='true' scroll-into-view="{{target}}" style="height:{{height}}px;" scroll-with-animation='{{scroll}}'>
<!--引导一-->
<view id="one" class="classname" bindtouchstart="moveStartTow" bindtouchend="moveEndTow" style="height: {{height}}px;width: 100%;">
<view style="height:{{height}}px">
<image src="../../public/image/guideone.jpg" style="width:100%;height:100%;"></image>
<view class="bottom" bindtap="btnBottomOne">
<view class="arrow-bottom" style="border-color: #29aae1;"></view>
</view>
</view>
</view>
<!--引导二-->
<view id="two" bindtouchstart="moveStartThree" bindtouchend="moveEndThree" class="classname" style="height: {{height}}px;width: 100%;">
<view style="height:{{height}}px">
<image src="../../public/image/guidetwo.jpg" style="width:100%;height:100%;"></image>
<view class="bottom" bindtap="btnBottomTwo">
<view class="arrow-bottom" style="border-color: #f6921e;"></view>
</view>
</view>
</view>
<!--引导三-->
<view id="three" bindtouchstart="moveStartFour" bindtouchend="moveEndFour" class="classname" style="height: {{height}}px;width: 100%;">
<image src="../../public/image/guidethree.jpg" style="width:100%;height:100%;"></image>
<view class="bottom" bindtap="btnBottomThree">
<view class="arrow-bottom" style="border-color: #8bc53f;"></view>
</view>
</view>
<!--首页-->
<view id="index" bindtouchstart="moveStartIndex" bindtouchend="moveEndIndex" class="classname" style="height: {{height}}px;width: 100%;">
<!--logo-->
<view style="height:{{height*0.44}}px;width: 100%; background-color: lightgray;">
<image src="../../public/image/logo.jpg" style="height:98%; width: 100%;"></image>
</view>
<!--feature-->
<view style="height:{{height*0.36}}px;width: 100%; background-color: lightgray;">
<view style="height: 24%;width: 100%; background-color: green;">
<image src="../../public/image/index_title_1.jpg" style="height: 100%;width: 100%;"></image>
</view>
<view style="height: 25%; width: 100%;display: flex; flex-direction: row;">
<view style="height: 100%; width: 50%;" bindtap="jumpHandleDeviceChoose">
<image src="../../public/image/index_feature_1.jpg" style="height: 100%; width: 100%;"></image>
</view>
<view style="height: 100%; width: 50%;" bindtap="jumpHandleTips">
<image src="../../public/image/index_feature_2.jpg" style="height: 100%; width: 100%;"></image>
</view>
</view>
<view style="height:24%;width: 100%;">
<image src="../../public/image/index_title_2.jpg" style="height: 100%; width: 100%;"></image>
</view>
<view style="height: 25%; width: 100%;display: flex; flex-direction: row;">
<view style="height: 100%; width: 50%;" bindtap="jumpHandleMoneySave">
<image src="../../public/image/index_feature_3.jpg" style="height: 100%; width: 100%;"></image>
</view>
<view style="height: 100%; width: 50%;" bindtap="jumpHandleEnergySave">
<image src="../../public/image/index_feature_4.jpg" style="height: 100%; width: 100%;"></image>
</view>
</view>
</view>
<!--slogan-->
<view style="height:{{height*0.2}}px;width: 100%; background-color: lightgreen;">
<image src="../../public/image/slogan.jpg" style="height: 100%; width:100%;"></image>
</view>
</view>
</scroll-view>
</view>
js代码这里不过多介绍，代码文件可见文章底部
效果如下：
配家电是项目的四大功能点之一
功能步骤如下
最终将显示配置家电的最佳方案，并且预估每年的电费价格和家电耗电排行榜
这里只展示结论界面代码
<view class="page">
<view class="result-top">
<image class='top-img' src="../../public/image/jl_Result.png"/>结论
</view>
<view class="dq_content">
<view class="dq-title">
<view class="title-b">配家电</view>
<view class="title-g">推荐结果如下</view>
</view>
<view class="pjd-list">
<view class="pjd-item">
<image class='item-img-kt' src="../../public/image/kt_g.png"></image>
<text class='item-txt'>空调</text>
<view class="item-detail" wx:if='{{iszykt}}'>
<view class="detail-line">
中央空调：<text class='color-b'> {{zykt_ps}}匹 </text>
</view>
</view>
<view class="item-detail" wx:else>
<view class="detail-line">
客厅：一台<text class='color-b'> {{ lskt_ps}}匹 </text>立式空调
</view>
<view class="detail-line">
大房间：一台<text class='color-b'> {{dfjgskt_ps}}匹 </text>挂式空调
</view>
<view class="detail-line">
小房间：<text class='color-b'> {{xfjgskt_ps}}匹 </text>挂式空调
</view>
</view>
</view>
<view class="pjd-item">
<image class='item-img-rsq' src="../../public/image/rsq_g.png"></image>
<text class='item-txt'>热水器</text>
<view class="item-detail">
<view class="detail-line">
<text class='color-b'> {{rsqRl}} </text>，功率<text class='color-b'> {{rsqGl}}W</text>
</view>
</view>
</view>
<view class="pjd-item">
<image class='item-img-dsj' src="../../public/image/dsj_g.png"></image>
<text class='item-txt'>电视机</text>
<view class="item-detail">
<view class="detail-line">
客厅：一台<text class='color-b'> {{size>110?'50寸':'小于50寸'}} </text>电视，功率<text class='color-b'> {{dsjGl}}W</text>
</view>
<view class="detail-line" wx:if='{{ys=="高档型"}}'>
卧室：{{shi}}台30寸，功率<text class='color-b'> {{dsjGl}}W</text>
</view>
</view>
</view>
<view class="pjd-item" wx:if='{{isdown}}'>
<image class='item-img-xyj' src="../../public/image/xyj_g.png"></image>
<text class='item-txt'>洗衣机</text>
<view class="item-detail">
<view class="detail-line">
容量<text class='color-b'> {{xyjKg}}公斤 </text>，功率<text class='color-b'> {{xyjGl}}W</text>
</view>
</view>
</view>
<view class="pjd-item" wx:if='{{isdown}}'>
<image class='item-img-dbx' src="../../public/image/dbx_g.png"></image>
<text class='item-txt'>电冰箱</text>
<view class="item-detail">
<view class="detail-line">
<text class='color-b'>{{size>89&&ys=="高档型"?'双开门':'普通'}}</text>冰箱：<text class='color-b'> {{dbxRl}}L </text>，功率<text class='color-b'> {{dbxGl}}W</text>
</view>
</view>
</view>
<view class="pjd-item" wx:if='{{isdown}}'>
<image class='item-img-dfb' src="../../public/image/dfb_g.png"></image>
<text class='item-txt'>电饭煲</text>
<view class="item-detail">
<view class="detail-line">
功率<text class='color-b'> {{dfbGl}}W</text>
</view>
</view>
</view>
<view class="pjd-item" wx:if='{{isdown}}'>
<image class='item-img-dcl' src="../../public/image/dcl_g.png"></image>
<text class='item-txt'>电磁炉</text>
<view class="item-detail">
<view class="detail-line">
功率<text class='color-b'>{{dclGl}}W</text>
</view>
</view>
</view>
<view class="pjd-item" wx:if='{{isdown}}'>
<image class='item-img-xyj' src="../../public/image/xyj_g.png"></image>
<text class='item-txt'>洗衣机</text>
<view class="item-detail">
<view class="detail-line">
功率<text class='color-b'> {{xwjGl}}W</text>
</view>
</view>
</view>
<view class="pjd-item" wx:if='{{isdown}}'>
<image class='item-img-wbl' src="../../public/image/wbl_g.png"></image>
<text class='item-txt'>微波炉</text>
<view class="item-detail">
<view class="detail-line">
功率<text class='color-b'> {{wblGl}}W</text>
</view>
</view>
</view>
<view class="pjd-item" wx:if='{{isdown}}'>
<image class='item-img-yyj' src="../../public/image/yyj_g.png"></image>
<text class='item-txt'>油烟机</text>
<view class="item-detail">
<view class="detail-line">
功率<text class='color-b'> {{yyjGl}}W</text>
</view>
</view>
</view>
<view class="pjd-item" wx:if='{{isdown}}'>
<image class='item-img-xdg' src="../../public/image/xdg_g.png"></image>
<text class='item-txt'>消毒柜</text>
<view class="item-detail">
<view class="detail-line">
功率<text class='color-b'> {{xdgGl}}W</text>
</view>
</view>
</view>
<view class="pjd-item" wx:if='{{isdown}}'>
<image class='item-img-kx' src="../../public/image/kx_g.png"></image>
<text class='item-txt'>烤箱/蒸箱</text>
<view class="item-detail">
<view class="detail-line">
功率<text class='color-b'> {{kxGl}}W</text>
</view>
</view>
</view>
<view class="pjd-item" wx:if='{{ys=="高档型"&&isdown}}'>
<image class='item-img-dcn' src="../../public/image/dcn_g.png"></image>
<text class='item-txt'>电采暖</text>
<view class="item-detail">
<view class="detail-line">
功率<text class='color-b'> {{dnqGl}}W</text>每平米
</view>
</view>
</view>
<view class="pjd-item" bindtap="toDown">
<view class="arraw" style='transform: rotate({{isdown?"145deg":"-35deg"}}) skewX(20deg);'>
</view>
</view>
</view>
</view>
<view class="tjdf">
<view class="tjjd-title">推荐家电年平均电费（元）:</view>
<view class="tjjd-num">{{kt_fax+rsq_fax+dsj_fax+xyj_fax+dbx_fax+dfb_fax+dcl_fax+xwj_fax+wbl_fax+yyj_fax+xdg_fax+kx_fax+dnq_fax-500}}~{{kt_fax+rsq_fax+dsj_fax+xyj_fax+dbx_fax+dfb_fax+dcl_fax+xwj_fax+wbl_fax+yyj_fax+xdg_fax+kx_fax+dnq_fax+500}}</view>
</view>
<view class="tjdf">
<view class="tjjd-title">耗能排行榜:</view>
<view class="pjd-list">
<view class="pjd-item" wx:for="{{dqArr}}" wx:for-index="idx" wx:if='{{idx<3}}' wx:for-item="dqItem" wx:key='a'>
<text class='item-txt item-num-{{idx==0?"r":idx==1?"o":"b"}}'>{{idx+1}}</text>
<image class='item-img-{{dqItem.cl}}' src="../../public/image/{{dqItem.cl}}_{{idx==0?'r':idx==1?'o':'b'}}.png"></image>
<text class='item-txt item-txt-{{idx==0?"r":idx==1?"o":"b"}}'>{{dqItem.name}}</text>
</view>
</view>
</view>
<view class="" style='padding:60rpx 0rpx;'>
<button class='result-btn' bindtap="back">返回主页</button>
</view>
</view>
小贴士展示生活中有关家电的有关信息
这里不做介绍
省电费的服务流程如下：
省电费功能将提供专业的用电建议，优化电价套餐
最终得出最佳套餐
同时用户可以进行套餐办理
节能源将对家庭的用电进行测评，同时u提供专业的用电方案
服务流程如下：
最终将以图例的形式展示
项目代码如下：
如何在buildr项目中使用Ruby？我在很多不同的项目中使用过Ruby、JRuby、Java和Clojure。我目前正在使用我的标准Ruby开发一个模拟应用程序，我想尝试使用Clojure后端(我确实喜欢功能代码)以及JRubygui和测试套件。我还可以看到在未来的不同项目中使用Scala作为后端。我想我要为我的项目尝试一下buildr(http://buildr.apache.org/)，但我注意到buildr似乎没有设置为在项目中使用JRuby代码本身!这看起来有点傻，因为该工具旨在统一通用的JVM语言并且是在ruby中构建的。除了将输出的jar包含在一个独特的、仅限ruby
我正在查看instance_variable_set的文档并看到给出的示例代码是这样做的:obj.instance_variable_set(:@instnc_var,"valuefortheinstancevariable")然后允许您在类的任何实例方法中以@instnc_var的形式访问该变量。我想知道为什么在@instnc_var之前需要一个冒号:。冒号有什么作用？ 最佳答案 我的第一直觉是告诉你不要使用instance_variable_set除非你真的知道你用它做什么。它本质上是一种元编程工具或绕过实例变量可见性的黑客攻击
在我的应用程序中，我需要能够找到所有数字子字符串，然后扫描每个子字符串，找到第一个匹配范围(例如5到15之间)的子字符串，并将该实例替换为另一个字符串“X”。我的测试字符串s="1foo100bar10gee1"我的初始模式是1个或多个数字的任何字符串，例如，re=Regexp.new(/\d+/)matches=s.scan(re)给出["1","100","10","1"]如果我想用“X”替换第N个匹配项，并且只替换第N个匹配项，我该怎么做？例如，如果我想替换第三个匹配项“10”(匹配项[2])，我不能只说s[matches[2]]="X"因为它做了两次替换“1fooX0barXg
我在我的Rails项目中使用Pow和powifygem。现在我尝试升级我的ruby版本(从1.9.3到2.0.0，我使用RVM)当我切换ruby版本、安装所有gem依赖项时，我通过运行railss并访问localhost:3000确保该应用程序正常运行以前，我通过使用pow访问http://my_app.dev来浏览我的应用程序。升级后，由于错误Bundler::RubyVersionMismatch:YourRubyversionis1.9.3,butyourGemfilespecified2.0.0，此url不起作用我尝试过的:重新创建pow应用程序重启pow服务器更新战俘
我已经像这样安装了一个新的Rails项目:$railsnewsite它执行并到达:bundleinstall但是当它似乎尝试安装依赖项时我得到了这个错误Gem::Ext::BuildError:ERROR:Failedtobuildgemnativeextension./System/Library/Frameworks/Ruby.framework/Versions/2.0/usr/bin/rubyextconf.rbcheckingforlibkern/OSAtomic.h...yescreatingMakefilemake"DESTDIR="cleanmake"DESTDIR="
我有一个正在构建的应用程序，我需要一个模型来创建另一个模型的实例。我希望每辆车都有4个轮胎。汽车模型classCar轮胎模型classTire但是，在make_tires内部有一个错误，如果我为Tire尝试它，则没有用于创建或新建的activerecord方法。当我检查轮胎时，它没有这些方法。我该如何补救？错误是这样的:未定义的方法'create'forActiveRecord::AttributeMethods::Serialization::Tire::Module我测试了两个环境:测试和开发，它们都因相同的错误而失败。 最佳答案
我正在处理旧代码的一部分。beforedoallow_any_instance_of(SportRateManager).toreceive(:create).and_return(true)endRubocop错误如下:Avoidstubbingusing'allow_any_instance_of'我读到了RuboCop::RSpec:AnyInstance我试着像下面那样改变它。由此beforedoallow_any_instance_of(SportRateManager).toreceive(:create).and_return(true)end对此:let(:sport_
假设我有这个范围:("aaaaa".."zzzzz")如何在不事先/每次生成整个项目的情况下从范围中获取第N个项目？ 最佳答案 一种快速简便的方法:("aaaaa".."zzzzz").first(42).last#==>"aaabp"如果出于某种原因你不得不一遍又一遍地这样做，或者如果你需要避免为前N个元素构建中间数组，你可以这样写:moduleEnumerabledefskip(n)returnto_enum:skip,nunlessblock_given?each_with_indexdo|item,index|yieldit
我收到格式为的回复#我需要将其转换为哈希值(针对活跃商家)。目前我正在遍历变量并执行此操作:response.instance_variables.eachdo|r|my_hash.merge!(r.to_s.delete("@").intern=>response.instance_eval(r.to_s.delete("@")))end这有效，它将生成{:first="charlie",:last=>"kelly"},但它似乎有点hacky和不稳定。有更好的方法吗？编辑:我刚刚意识到我可以使用instance_variable_get作为该等式的第二部分，但这仍然是主要问题。
前言一般来说，前端根据后台返回code码展示对应内容只需要在前台判断code值展示对应的内容即可，但要是匹配的code码比较多或者多个页面用到时，为了便于后期维护，后台就会使用字典表让前端匹配，下面我将在微信小程序中通过wxs的方法实现这个操作。为什么要使用wxs？{{method(a,b)}}可以看到，上述代码是一个调用方法传值的操作，在vue中很常见，多用于数据之间的转换，但由于微信小程序诸多限制的原因，你并不能优雅的这样操作，可能有人会说，为什么不用if判断实现呢？但是if判断的局限性在于如果存在数据量过大时，大量重复性操作和if判断会让你的代码显得异常冗余。wxswxs相当于是一个独立