Question

我是Ember的新手。我希望当我将鼠标悬停在.png文件上时是透明的，并在右下角存在一个“X”按钮，当你按下它时，它将从商店中删除。任何想法或任何例子？我有这些文件：

showactivecamp.hbs

<style type="text/css">


    .image {
        width: 190px;
        height: 190px;
        opacity: 1;

    }

    .image:hover {
        opacity: 0.3;
    }

    i.fa-remove {
    @extend . image : hover;
        color: #fff;
        background-color: #808080;
        background-color: rgba(0, 0, 0, 0.5);
        position: absolute;
        top: 8px;
        right: 8px;
        padding: 2px;
        z-index: 1;
        cursor: pointer;
    }


</style>

<div class="thmb-prev">

                    <button type="button" class="fa fa-remove" {{action "removeCampaign" on="click"}}>


                    </button>
                    <img src="/assets/images/photos/media2.png" class="image" alt="">

                </div>

控制器\ showactivecamp.js

import Ember from 'ember';

export default Ember.ObjectController.extend({
    needs: ['campaign'],

    actions: {
        removeCampaign: function (campaign) {

            var camp = this.get('model');
            camp.deleteRecord();
            camp.save();

        }
    },

    getactivecamp: function () {
        return this.store.findAll('campaign');
    }.property()

});

视图\ showactivecamp.js 从'余烬'中导入Ember;

export default Ember.View.extend({

    click: function (evt) {
        this.get('controller').send('click', this.get('campaign'));
    }

 });

Answer 1

您发布了代码但未提及该问题。我不确定你得到的问题是什么。

看看这个jsbin http://jsbin.com/xumomu/1。我用过FixtureAdapter。

更新：

http://jsbin.com/xumomu/2/

我在一个名为＆＃39; image＆＃39;的视图中包装了图片并关闭了图标。鼠标输入时将显示X图标，使用jQuery将在鼠标离开时隐藏。

As Ember guide says, Use View when you need sophisticated handling of user events.

我建议你阅读文档，以便清楚了解ember中的视图和事件处理。

Answer 2

我相信这样的事情最好用CSS解决方案处理，而不是在Javascript中创建不必要的视图

http://emberjs.jsbin.com/jecew/1

鼠标悬停在余烬上

2 个答案: