Api routes

/**
 * API Authentication
 */
Route::group(['middleware' => 'api'], function() {
    Route::post('/auth/signup', 'Auth\AuthAPIController@signup');
    Route::post('/auth/signin', 'Auth\AuthAPIController@signin');
});

----------------------------------

AuthAPIController

class AuthAPIController extends Controller
{
    public function signin(LoginControllerRequest $request){

        $credentials = $request->only('email','password');


        try {
            // attempt to verify the credentials and create a token for the user
            if (! $token = JWTAuth::attempt($credentials)) {
                return response()->json(['error' => 'invalid_credentials'], 401);
            }
        } catch (JWTException $e) {
            // something went wrong whilst attempting to encode the token
            return response()->json(['error' => 'could_not_create_token'], 500);
        }

        // all good so return the token
          return Fractal::create()
                        ->item($request->user())
                        ->transformWith(new UserTransformer)
                        ->addMeta([
                            'token' => $token
                        ])
                        ->toArray();
        }


    public function signup(ReqisterControllerRequest $request){

       //dd($request->name);
       User::create([
            'name' => $request->name,
            'email' => $request->email,
            'password' => bcrypt($request->password),
        ]);

    }
}

----------------------------------------

Cors Middleware

class Cors
{
    /**
     * Handle an incoming request.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \Closure  $next
     * @return mixed
     */
    public function handle($request, Closure $next)
    {
        return $next($request)
                ->header('Access-Control-Allow-Origin','*')
                ->header('Access-Control-Allow-Methods','POST,GET,OPTIONS')
                ->header('Access-Control-Allow-Headers','X-Requested-With,Content-Type,Accept,Authorization');
    }
}

Kernel.php

 protected $middleware = [
        \Illuminate\Foundation\Http\Middleware\CheckForMaintenanceMode::class,
        \App\Http\Middleware\Cors::class,
    ];

-----------------------------------

Vue.js stuff
------------
src/routes.js

import Vue from 'vue'

import VueRouter from 'vue-router'

import Home from './components/Home'
import SignIn from './components/SignIn'
import SignUp from './components/SignUp'
import NewTopic from './components/NewTopic'
import Topic from './components/Topic'
import Topics from './components/Topics'

Vue.use(VueRouter)

const router = new VueRouter({
	routes:[
		{
			path:'/',
			component:Home,
			name:'home'
		},
		{
			path:'/signin',
			component:SignIn,
			name:'signin'
		},
		{
			path:'/signup',
			component:SignUp,
			name:'signup'
		},
		{
			path:'/topic/new',
			component:NewTopic,
			name:'newtopic'
		},
		{
			path:'/topic/:topicId',
			component:Topic,
			name:'topicbyId'
		},
		{
			path:'/section/:sectionId',
			component:Topics,
			name:'section'
		}
	]
})

	export default router

--------------------------------------
src/main.js

import Vue from 'vue'
import App from './App'
import Router from './routes.js'
import VueResource from 'vue-resource'

Vue.use(VueResource)
Vue.http.options.root = 'http://forumapi.app:8000'

export default Vue
/* eslint-disable no-new */
new Vue({
  el: '#app',
  components: { App },
  render : h =>h(App),
  router:Router
})

---------------------------------

src/auth/index.js

import Vue from '../main.js'
import {router} from '../routes.js'

export default{
	signup(context,email,name,password) {
		Vue.http({
			url:'auth/signup',
			method:'POST',
			data:{
				email:email,
				name:name,
				password:password
			}
		}).then(response => {
			context.success = true
		}).catch(response => {
			context.response = response.data
			context.error = true
		})
	},
	signin(context, email, password){
		Vue.http({
			url:'auth/signin',
			method:'POST',
			data:{
				email:email,
				password:password
			}
		}).then(response => {
			console.log('ok');
		},response => {
			console.log('not')
		})
	}
}

-------------------------------------------
src/components/Signin.vue

<template>
	<div>
		<div class="alert alert-danger" v-if="error">
			<p>Error</p>
		</div>
		<div class="row">
			<div class="col-md-6 col-md-offset-3">
				<form autocomplete="off" v-on:submit="signin">
					<div class="form-group">
						<label for="email" class="label label-warning">Email</label>
						<input type="text" v-model="email" class="form-control" required/>
					</div>
					<div class="form-group">
						<label for="password" class="label label-warning">Password</label>
						<input type="password" v-model="password" class="form-control" required/>
					</div>
					<div class="form-group">

						<button type="submit" class="form-control btn btn-primary">Sign Up</button>
					</div>


				</form>

			</div>

		</div>
	</div>
</template>

<script>
	import auth from '../auth'
	export default{
		name:'signin',
		data(){
			return {
				email:null,
				password:null,
				error: false
			}
		},
		methods:{
			signin (e){
			e.preventDefault()
				auth.signin(this,this.email,this.password)
			}
		}

	}

</script>

ERROR: POST http://forumapi.app:8000/auth/signin 422 (Unprocessable Entity)
{email: ["The email field is required."], password: ["The password field is required."]}

i've console.log each field in the component, and i get the expected result, so data exists.

----------------------------------------------------------------------------------------------
src/components/SignUp.vue

<template>
	<div>
		<div class="alert alert-danger" v-if="error">
			<p>Error</p>
		</div>
		<div class="row">
			<div class="col-md-6 col-md-offset-3">
				<form autocomplete="off" v-on:submit="signup">
					<div class="form-group">
						<label for="email" class="label label-warning">Email</label>
						<input type="text" v-model="email" class="form-control" required/>
					</div>
					<div class="form-group">
						<label for="username" class="label label-warning">Username</label>
						<input type="text" v-model="username" class="form-control" required/>
					</div>
					<div class="form-group">
						<label for="password" class="label label-warning">Password</label>
						<input type="password" v-model="password" class="form-control" required/>
					</div>
					<div class="form-group">

						<button type="submit" class="form-control btn btn-primary">Sign Up</button>
					</div>


				</form>

			</div>

		</div>
	</div>
</template>

<script>
	import auth from '../auth'
	export default{

		data(){
			return {
				email : null,
				password : null,
				username : null,
				error : false,
				success : false,
				response : null

			}
		},
		methods:{
			signup(e){
				e.preventDefault()
				auth.signup(this,this.email,this.username,this.password)
				//console.log(this.email,this.name,this.password)
			}
		}
	}
</script>

ERROR: POST http://forumapi.app:8000/auth/signin 422 (Unprocessable Entity)
{email: ["The email field is required."], username: ["The username field is required."], password: ["The password field is required."]}