vue js базовая часть

123

12 ноября 2019, 00:50

<!DOCTYPE html>
<html >
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
     <script src="vue.js"></script>
    <title>Document</title>
</head>
<body>
<script src="vue.js"></script>
    <div id="app">
   <h2 >
    Счеткич {{counter}}
   </h2>
        <button v-on:click="riseCounter">Увеличить</button>
    </div>
    <script>
    new Vue(
    {
        el :'#app',
        data:{
              counter :0
        },
        method:
            {
                riseCounter:function(){
                    this.counter++;
                }
            }
    })
    </script>
</body>
</html>

не понимаю что не так вроде базовая вещь ошибки

Vue warn]: Property or method "riseCounter" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See: https://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties.
(found in <Root>)
warn @ vue.js:634
warnNonPresent @ vue.js:2046
has @ vue.js:2091
(anonymous) @ VM298:3
Vue._render @ vue.js:3538
updateComponent @ vue.js:4038
get @ vue.js:4439
Watcher @ vue.js:4428
mountComponent @ vue.js:4045
Vue.$mount @ vue.js:9002
Vue.$mount @ vue.js:11886
Vue._init @ vue.js:4973
Vue @ vue.js:5039
(anonymous) @ index.html?_ijt=sn6clu1m2oe2l6lf81kha9mka4:21
vue.js:634 [Vue warn]: Invalid handler for event "click": got undefined
(found in <Root>)
    введите сюда код