Git Product home page Git Product logo

Comments (7)

maksakoviliya avatar maksakoviliya commented on July 18, 2024

image
Вот в таком модальном окне, при правом клике, нет даже пункта Select

from vue-laravel-file-manager.

maksakoviliya avatar maksakoviliya commented on July 18, 2024

image

from vue-laravel-file-manager.

alexusmai avatar alexusmai commented on July 18, 2024

Добрый день, спасибо.
Чтобы появился select вам нужно передать файловому менеджеру функцию которая будет вызываться при выборе файла, например как тут
В эту функцию первым и единственным параметром будет передана ссылка на выбранный файл, ну и плюс вы можете вызвать нужные вам действия.
Если файл менеджер используется не только для выбора изображении не забудьте обнулить параметр fileCallback после выбора изображения.

from vue-laravel-file-manager.

maksakoviliya avatar maksakoviliya commented on July 18, 2024

Благодарю за ответ, но, видимо, я туповат, не понимаю где прописать эту функцию))
Вот блок кода, который отвечает за вывод Вашего файл менеджера. Есть мой компонент, внутри которого модальное окно бутсрап, вызывается jquery (Не уверен что это хорошо, но повторюсь, туповат)). В том примере, который Вы скинули - есть $emmit функции, указанной в opener. Т.е. при selecte - вызывается функция. А как передать эту функцию из компонента??? Еще раз благодарю! Вы сделали очень крутую вещь!

<template>
  <div>
    <button class="btn btn-outline-secondary" 
            type="button"
            data-toggle="modal"
            data-target="#fileUploaderModal"
          >Select</button>
    <div class="modal fade bd-example-modal-lg" tabindex="-1" id="fileUploaderModal" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
      <div class="modal-dialog modal-lg">
        <div class="modal-content">
          <file-manager></file-manager>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
  export default { 
    
  }
</script>

from vue-laravel-file-manager.

maksakoviliya avatar maksakoviliya commented on July 18, 2024

Есть у кого мысли?)

from vue-laravel-file-manager.

alexusmai avatar alexusmai commented on July 18, 2024

Примерно так:

<template>

    <div class="container">

        <!-- Button trigger modal -->
        <button v-on:click="show()" type="button" class="btn btn-primary">
            Launch demo modal
        </button>

        <!-- Modal -->
        <div class="modal fade bd-example-modal-xl" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
            <div class="modal-dialog modal-xl" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <div style="height: 600px;">
                            <file-manager></file-manager>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        methods: {
            show() {
                $('#exampleModal').modal('show');

                // set callback
                this.$store.commit('fm/setFileCallBack', url => {
                    // use the file url
                    console.info(`File chosen!!! - ${url}`);
                    // close modal window
                    $('#exampleModal').modal('hide');
                });
            },
        },
    };
</script>

вместо console.info делаете что вам необходимо с полученным url

from vue-laravel-file-manager.

maksakoviliya avatar maksakoviliya commented on July 18, 2024

Спасибо Вам огромное! Именно то, что нужно!!

from vue-laravel-file-manager.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.