Mehmet Ozdemir Ce

Vue js vuex ile store edilen dataları app seviyesinde merkezi bir yerde tutar herkes erisir öncelikle dependency olarak vuex eklenir npm install --save vuex Store.js // bunu kendimiz olusturduk burda tanimlicaz ------------------------------------------------- import Vue from "vue"; import Vuex from "vuex"; Vue.use(Vuex); // vue ya vuex i kullanacağımızı söylüyoruz export const store = new Vuex.Store({ state:{ counter:0 }, getters : { getDoubleCounter(state){ return state.counter*2; } stringCounter(state){ return state.counter++ +" kez tiklandi "; } } }); main.js ------------------------------------------------- import Vue from "vue"; import App from "./App.vue"; import {store} from "./store/store" new Vue({ el: '#app', store, render : h=>h(App) }); Counter.vue ------------------------------------------------- + artir + azalt ...

Vue js vuex ile store edilen dataları app seviyesinde merkezi bir yerde tutar herkes erisir öncelikle dependency olarak vuex eklenir npm install --save vuex Store.js // bunu kendimiz olusturduk burda tanimlicaz ------------------------------------------------- import Vue from "vue"; import Vuex from "vuex"; Vue.use(Vuex); // vue ya vuex i kullanacağımızı söylüyoruz export const store = new Vuex.Store({ state:{ counter:0 }, getters : { getDoubleCounter(state){ return state.counter*2; } } }); main.js ------------------------------------------------- import Vue from "vue"; import App from "./App.vue"; import {store} from "./store/store" new Vue({ el: '#app', store, render : h=>h(App) }); Counter.vue ------------------------------------------------- + artir + azalt Result.vue ------------------------------------------------- say...

Vue js vuex ile store edilen dataları app seviyesinde merkezi bir yerde tutar herkes erisir öncelikle dependency olarak vuex eklenir npm install --save vuex Store.js // bunu kendimiz olusturduk burda tanimlicaz ------------------------------------------------- import Vue from "vue"; import Vuex from "vuex"; Vue.use(Vuex); // vue ya vuex i kullanacağımızı söylüyoruz export const store = new Vuex.Store({ state:{ counter:0 } }); main.js ------------------------------------------------- import Vue from "vue"; import App from "./App.vue"; import {store} from "./store/store" new Vue({ el: '#app', store, render : h=>h(App) }); Counter.vue ------------------------------------------------- + artir + azalt Result.vue ------------------------------------------------- sayaç: {{counter}} App.vue --------------------------------...

bu yonlerndirmeleri Vue js te VueRouter Kutuphanesi kullanılır terminalde yazılır npm install --save vue-router // ile yüklenir. burdaki save flagini kaldırdığımız için package json dosyası güncellenir. ---------------------------------------------- Main.js import Vue from "vue" import App from "./App.vue" import VueRouter from "vue-router"; import { routes } from "./routes"; Vue.use(VueRouter); const router = new VueRouter({ routes : routes mode: "history" // "hash" default tur # cıkar }); new Vue({ el:'#app', router:router render: h=> h(App) }) ---------------------------------------------- routes.js. import Home from "./components/Home"; import User from "./components/User"; import UserStart from "./components/UserStart"; import UserDetail from "./components/UserDetail"; import UserEdit from "./components/UserEdit"; ex...

bu yonlerndirmeleri Vue js te VueRouter Kutuphanesi kullanılır terminalde yazılır npm install --save vue-router // ile yüklenir. burdaki save flagini kaldırdığımız için package json dosyası güncellenir. ---------------------------------------------- Main.js import Vue from "vue" import App from "./App.vue" import VueRouter from "vue-router"; import { routes } from "./routes"; Vue.use(VueRouter); const router = new VueRouter({ routes : routes mode: "history" // "hash" default tur # cıkar }); new Vue({ el:'#app', router:router render: h=> h(App) }) ---------------------------------------------- routes.js. import Home from "./components/Home"; import User from "./components/User"; export const routes = [ { path: '', component : Home, name:"Anasayfa"}, { path: '/user/:id', component: User, name:"Kullanicilar"}, // /:id...

Bir Sayfa üzerinden Kullnıcı navigasyonları ile farklı sayfaları aynı sayfa içersinde gösterilebilmesi durumuna single page application deniyor. bu yonlerndirmeleri Vue js te VueRouter Kutuphanesi kullanılır npm install --save vue-router // ile yüklenir. burdaki save flagini kaldırdığımız için package json dosyası güncellenir. c Main.js import Vue from "vue" import App from "./App.vue" import VueRouter from "vue-router"; // npm den cektik mainde kullanıyoruz import diyip use dicyoruz asagıda import { routes } from "./routes"; // baska js dosyasında tanımladık burda import edip kullancaz Vue.use(VueRouter); const router = new VueRouter({ routes : routes // bu sekilde de tanımlana bilir sağdaki de kaldırılabilir ecmascript 6. kendisi tamamlar mıs mode: "history" // "hash" default tur # cıkar }); new Vue({ el:'#app', router:router render: h=> h(App) }) ----------------------...

Bir Sayfa üzerinden Kullnıcı navigasyonları ile farklı sayfaları aynı sayfa içersinde gösterilebilmesi durumuna single page application deniyor. bu yonlerndirmeleri Vue js te VueRouter Kutuphanesi kullanılır npm install --save vue-router // ile yüklenir. burdaki save flagini kaldırdığımız için package json dosyası güncellenir. c Main.js import Vue from "vue" import App from "./App.vue" import VueRouter from "vue-router"; // npm den cektik mainde kullanıyoruz import diyip use dicyoruz asagıda import { routes } from "./routes"; // baska js dosyasında tanımladık burda import edip kullancaz Vue.use(VueRouter); const router = new VueRouter({ routes : routes // bu sekilde de tanımlana bilir sağdaki de kaldırılabilir ecmascript 6. kendisi tamamlar mıs mode: "history" // "hash" default tur # cıkar }); new Vue({ el:'#app', router:router render: h=> h(App) }) ----------------------...