Bye Bye Moore

PoCソルジャーな零細事業主が作業メモを残すブログ

gopherjs-vueで作ってない関数をhtmlファイルで呼ぶと……動かない

golang javascript

前回の記事が完全に止まった原因でもあります

gopherjs-vueで作ってない関数をhtmlファイルで呼ぶと……動かないです。

実際のところ

たとえば、以下のコードは実装してない関数を入れてないので動きません

<!DOCTYPE html>
<html>

<body>
    <div id="app" v-cloak>
        <div>integer: {{ integer }}
            <input v-model="integer"></input>
        </div>
        <div>str: {{ str }} </div>
        <button v-on:click="Inc">Increase</button>
        <button v-on:click="Repeat">Repeat</button>
        <button v-on:click="Reset">Reset</button>
    </div>
    <script type="text/javascript" src="basic.js"></script>
</body>

</html>

package main

import (
	"github.com/gopherjs/gopherjs/js"
	"github.com/oskca/gopherjs-vue"
)

type Model struct {
	*js.Object        // this is needed for bidirectional data bindings
	IntValue   int    `js:"integer"`
	Str        string `js:"str"`
}

func main() {
	m := &Model{
		Object: js.Global.Get("Object").New(),
	}
	// field assignment is required in this way to make data passing works
	m.IntValue = 100
	m.Str = "a string"
	// create the VueJS viewModel using a struct pointer
	vue.New("#app", m)
}