Bye Bye Moore

猫マンション建築の野望を胸に零細事業主として資本主義の荒波に漕ぎ出したアラサー男の技術メモ

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

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

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)
}