0
Spine = require('spine')
Welcome = require('controllers/welcome')
Signup = require('controllers/signup')

class Main extends Spine.Stack
  controllers:
    welcome: Welcome
    signup: Signup

  default: 'signup'

  routes:
    '/welcome': 'welcome'
    '/signup': 'signup'

module.exports = Main

welcomeコントローラーとコントローラーはsignupビューをレンダリングするだけなので、スタックがどのように機能するかを理解できます。

Spine = require('spine')

class Welcome extends Spine.Controller
  className: 'welcome'

  constructor: ->
    super
    @active @render

  render: ->
    console.log 'welcome render function'
    @html require('views/welcome')()

module.exports = Welcome

そして、スタック ドキュメントごとに、これを CSS に追加しました。

.stack > *:not(.active) {
  display: none
}

@navigate('/welcome')スタックをどのように制御するかを確認するために、ビューをレンダリングするのではなく、意図的にサインアップ コントローラーに実行させます。console.logウェルカムの render 関数のステートメントは呼び出されますが、ウェルカム<div>にはクラスが追加されておらずactive、上記の CSS のために表示されていません。

ドキュメントを数回読み直し、グーグルで検索しましたが、何が欠けているのかわかりません。アクティブなクラスがウェルカム エルに追加されないのはなぜですか?

4

1 に答える 1