Giter Club home page Giter Club logo

Comments (15)

lizzie avatar lizzie commented on July 18, 2024

看了三遍的描述. 没懂你是想要全关闭的效果还是不是.

如果是初始化就是全关闭所有 panel, 你看官方 demo , http://aralejs.org/switchable/examples/accordion.html 这个不就是全部关闭了嘛

from switchable.

hbrls avatar hbrls commented on July 18, 2024
  1. multiple: true 的情况下可以全关闭,就像demo里一样
  2. multiple: false 的情况下不能全关闭, 我想要在这种情况下全关闭
  3. multiple: false, activeIndex: -1 的情况下,初始化的时候是全关闭的,所以我觉得全关闭对应的css是存在的

from switchable.

hbrls avatar hbrls commented on July 18, 2024

我跟进去看了一下代码逻辑是这样的

if (this.get("multiple")) {
    this._switchTo(toIndex, toIndex);
} else {
    this.set("activeIndex", toIndex);
}

如果 toIndex 就是当前 index,那么没办法关闭

from switchable.

lizzie avatar lizzie commented on July 18, 2024

欢迎提交 pr ~~

这个可以改进..

from switchable.

hbrls avatar hbrls commented on July 18, 2024

好吧,那我再想想

from switchable.

lizzie avatar lizzie commented on July 18, 2024

我的意思是你可以 fork 下 switchable, 修改后 发 pr , 我们看再合并

from switchable.

hbrls avatar hbrls commented on July 18, 2024

恩,我知道,我只是还没完全看懂怎么开发和打包 sea-modules

from switchable.

lizzie avatar lizzie commented on July 18, 2024

看这个 http://aralejs.org/docs/develop-components.html

基本上就是 clone 下来, 安装个 spm , 然后, 修改代码, spm doc watch , 看效果, 就行了

from switchable.

hbrls avatar hbrls commented on July 18, 2024

accordion-debug.js 第 15 行增加对 this.get('activeIndex') === toIndex 的判断,只影响 accordion,对 family 的其他插件没有影响,这思路可以么

switchTo: function(toIndex) {
    if (this.get("multiple")) {
        this._switchTo(toIndex, toIndex);
    } else {
        if (this.get('activeIndex') === toIndex) {
            Switchable.prototype.switchTo.call(this, -1);
        } else {
            Switchable.prototype.switchTo.call(this, toIndex);
        }
    }
},

from switchable.

lizzie avatar lizzie commented on July 18, 2024

这样的话, 使用时怎么配置呢? 得另外配置 activeIndex ?

from switchable.

lizzie avatar lizzie commented on July 18, 2024

试了下, 还是有点问题的.

    accordion = new Accordion({
        element: '#accordion-demo-1',
        activeIndex: -1
    }).render();

最后一个 trigger 加上了 ui-switchable-active

<div class="ui-switchable-trigger last-trigger ui-switchable-active" data-switchable-role="trigger"><h3>标题D</h3></div>

from switchable.

hbrls avatar hbrls commented on July 18, 2024

因为 jqueryeq 可以处理负数,改成 -9999 就好了。不过这样太怪了,我再想想。

from switchable.

hbrls avatar hbrls commented on July 18, 2024

而且目前 multiple: true 的情况下实现的全关闭逻辑上也是不完美的。

先设这样的 html

<div class=" div-0">
<div class=" div-1 hidden">
<div class=" div-2 hidden last">

由于 activeIndex: 0div-0toggle 之后变成 hidden 了。也就是说当前的 activeIndex0,但是 div-0triggerClassactivepanelClass 也不 active

from switchable.

hbrls avatar hbrls commented on July 18, 2024

还发现一个问题,用 ajax 新插进来的 trigger 和 panel 事件好像没有绑到,我觉得我还是不要用 Accordion 了,自己扩展 Widget

from switchable.

lizzie avatar lizzie commented on July 18, 2024

恩. 目前 switchable 不支持动态增加/删除 trigger 或 panel

from switchable.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.