A simple vue-apollo example app
Needs apollo-server-example running.
# install dependencies
npm install
# serve with hot reload at localhost:8080
npm run dev
# build for production with minification
npm run build
Simple vue-apollo example app
A simple vue-apollo example app
Needs apollo-server-example running.
# install dependencies
npm install
# serve with hot reload at localhost:8080
npm run dev
# build for production with minification
npm run build
It would be great if you can provide some exampe using Typescript in near future. ๐
I get a problem,I want do this:
mutation{ cancleAskOrders: cancelOrder(pairId: 1,direction: ASK){ status } cancleBidOrders: cancelOrder(pairId: 1,direction: BID){ status } }
how to do it with vue-apollo
A "Hello world!" would be much better.
Please update this example.
Hi, I am new to Vue, I made a branch where I have split the tags page into two https://github.com/tb/vue-apollo-example/tree/routes
When I go between the routes the data is reloading. How can the data be shared between routes? In react-apollo redux store is used for this.
I can't seem to grasp your use of client. In the example you are using a web socket client.
When I try to use vue-apollo with scaphold.io config, it fails with $apollo.client
undefined
and also shows query
and mutate
properties with TypeError since undefined
.
What gives?
As you can see I experimented with trying to use localhost as ws client, then disabled on advice from @vince from scaphold.io
import ApolloClient, { createNetworkInterface } from 'apollo-client'
// import { Client } from 'subscriptions-transport-ws'
// import { addGraphQLSubscriptions } from 'vue-apollo';
import config from '../config/client'
const networkInterface = createNetworkInterface({
uri: config.scapholdUrl,
transportBatching: true
})
// const wsClient = new Client('ws://localhost:3001')
// const networkInterfaceWithSubscriptions = addGraphQLSubscriptions(
// networkInterface,
// wsClient,
// )
networkInterface.use([{
applyMiddleware (req, next) {
if (!req.options.headers) {
req.options.headers = {} // Create the header object if needed.
}
if (localStorage.getItem('token')) {
req.options.headers.Authorization = `Bearer ${localStorage.getItem('token')}`
}
next()
}
}])
const client = new ApolloClient({
networkInterface // : networkInterfaceWithSubscriptions
})
// Install the vue-apollo plugin and use the apollo client
Vue.use(VueApollo, {
client
})
new Vue({
...App,
apollo: {
// Apollo specific options
}
}).$mount('#app')
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.