0

私は自分のlaravel 5.4 cms admin-panelプロジェクトでvue.jsを使用しようとしています...ユーザーがパスワードをリセットしようとするたびに、チェックボックスを選択してチェックボックスを選択できるように、vue.jsでチェックボックスを作成しようとしていますauto_generate パスワードを持っているか、手動で入力します。auto_generate パスワードを選択すると、パスワード入力ワードが見えなくなります。私はブートストラップで vue を使用していますが、vue 自体がプロジェクトに反映されていないかのように応答していません。これは私のコードです...

Create.blade.php

@extends('layouts.manage')

@section('content')
    <div class="flex-container m-t-10">
        <div class="columns m-l-10">
            <div class="row">
                <h1 class="title m-l-15">Create New Users</h1>
            </div>              
        </div>
        <hr class="m-t-0">

        <form action="{{route('users.store')}}" method="POST">
            {{csrf_field()}}

                <div class="col-lg-offset-0 col-md-12 thumbnail">
                    <div class="form-group">
                        <label for="name" class="control-label">Name:</label>                       
                        <input type="text" name="name" class="form-control" id="name" value="{{ old('name')}}" placeholder="Enter your name...">
                    </div>

                    <div class="form-group">
                        <label for="email" class="control-label">Email:</label>                     
                        <input type="text" name="email" class="form-control" id="email" value="{{ old('email')}}" placeholder="Enter your email...">
                        <small>Your email is confidential with us</small>
                    </div>

                    <div class="form-group">
                        <label for="password" class="control-label">Password:</label>                       
                        <input type="password" name="password" class="form-control" id="password" v-if="!auto_password" placeholder="Enter your password...">
                        <b-checkbox name="auto_generate" class="m-t-15" v-model="auto_password">Auto Generate Password</b-checkbox>
                    </div>                                      
                </div>
            </div>

            <div>
            <button class="btn btn-md btn-success fa fa-user-plus pull-right"> Create New User</button>         
            </div>          
        </form>

            <div>
            <a class="btn btn-warning btn-md fa fa-caret-left pull-left" href="{{route('users.index')}}"> Back</a>          
            </div>

</div>
@endsection

@section('scripts')
  <script>
    var app = new Vue({
      el: '#app',
      data: {
        auto_password: true,
    }
    });
  </script>
@endsection

app.js

require('./bootstrap');

window.Vue = require('vue');

Vue.component('example', require('./components/Example.vue'));

const app = new Vue ({
    el: '#app'
});

node_modules「node_modules/bootstrap-vue/dist/bootstrap-vue」、私のapp.scssファイルにあります...多分私はそれを正しくしていません。App.scss

// Variables
@import "variables";

// Font Awesome
@import "node_modules/font-awesome/scss/font-awesome";

// bootstrap-vue
@import "node_modules/bootstrap-vue/dist/bootstrap-vue";

// Custom SASS Pages
@import "overrides";
@import "helpers";
@import "manage/";
@import "styles";

私が間違っていることの提案をいただければ幸いです。ありがとう

4

0 に答える 0