2016-08-29 4 views
0

sri & scala-react/scala-jsを使用して反応コンポーネントのクリックハンドラを作成しようとしています。sri/scala-reactを使用してクリックコールバックを作成するにはどうすればよいですか?

次のコードでは、onClickハンドラを解決できません。私はそれが型の注釈か何かをとると思うが、私は例からそれをコピーした(tickを検索するとpage)。ここで

は私のコードです:

package demo.web.screens 

import org.scalajs.dom 
import demo.web.styles.GlobalStyle 
import shared.contactform.ContactForm 
import sri.core._ 
import sri.scalacss.Defaults._ 
import sri.web.all._ 
import sri.web.vdom.htmltags._ 

import scala.scalajs.js 
import scala.scalajs.js.annotation.ScalaJSDefined 

object ContactScreen { 

    @ScalaJSDefined 
    class Component extends ReactComponent[Unit, Unit] { 

    var bodyRef: dom.html.Input 
    var nameRef: dom.html.Input 
    var emailRef: dom.html.Input 

    def handleClick(e: ReactMouseEventI) = { 
     Option(bodyRef).foreach { body => 
     val form = ContactForm(body = body.value, 
      name = Option(nameRef).map(_.value), 
      email = Option(emailRef).map(_.value)) 

     println(s"Inside click handler with form: $form") 
     } 
    } 

    def render() = { 
     dom.console.log("In contact screen") 

     val contactForm = ContactForm(body = "static body", name = None, email = None) 
     println(s"contact form = $contactForm") 

     form()(
     div(className = GlobalStyle.flexOneAndCenter)(
      span(className = GlobalStyle.bigText)("Contact us"), 
      label()("Your name", 
      input(id = "name", ref = (e: dom.html.Input) => nameRef = e)), 
      label()("Your email address", 
      input(`type`="email", id = "email", 
       ref = (e: dom.html.Input) => emailRef = e)), 
      label()("Comments", 
      textarea(id = "body", ref = (e: dom.html.Input) => bodyRef = e)()), 
      button(id = "submit", onClick = handleClick _)("Submit") 
     ) 
    ) 
    } 
    } 

    val constructor = getTypedConstructor(js.constructorOf[Component], classOf[Component]) 

    def apply(key: js.UndefOr[String] = js.undefined, 
      ref: js.Function1[Component, _] = null) = { 
    createElementNoProps(constructor, key = key, ref = ref) 
    } 
} 
+0

もっと焦点を絞ったコードスニペットを投稿してください。エラーが2行で簡単に再現できる場合には、約60行を投稿しました。 – nafg

+0

正確なエラーメッセージを含めてください。 "解決できない"ということはあまり明確ではない。 – nafg

+0

「sri&scala-react/scala-js」 - ここでは「scala-react」と呼ばれる別のものはありませんが、scala-js-reactというライブラリがあり、これはSriの代わりに – nafg

答えて

1

あなたは、エラーメッセージが含まれていないが、私はあなたがそう、私はGdを喜んで、すぐにスリランカでこれを修正したいと考えていbutton(id = "submit", onClick = handleClick(_: ReactMouseEventI))("Submit")またはbutton(id = "submit", onClick = (evt: ReactMouseEventI) => handleClick(evt))

を記述する必要が信じていますあなたのようなコードはうまく動作します。

+0

あなたの返信をありがとう、申し訳ありません、私は正確にはできませんでしたが、私はちょうどintellijに間違いを起こしていました。私はあなたの変更を行いましたが、まだ "実装されていないメンバーが3つあるため、クラスコンポーネントは抽象クラスでなければなりません"というエラーが返され、 'bodyRef_'、' emailRef_'および 'nameRef_'はオーバーライドされません。 – jbrown

+0

ああ、私が密集しているかもしれない – jbrown

関連する問題