更新全局组件数据

时间:2018-07-07 21:46:56

标签: laravel vue.js vue-component

我正在用新代码对其进行更新。我需要在dropzones“ onSuccess”方法中获取对数据对象的“ allImages”属性的引用。有什么办法吗?

<template>
<div class="container">
    <div class="row">
        <form action="/user/album_images" id="dropzone" class="dropzone" method="post">

        <input type="hidden" id="album_id" name="album_id" :value=image.id>
            </form>
    </div>

    <div class="row">
        <div class="col-md-3" v-for="image in albumImages">
        <img src="https://mysite.nyc3.digitaloceanspaces.com/users/62MY43og3ZNCLU4y53iwoqdEfUZUWFEfDM2f9krn.png" class="img-responsive" style="width: 120px; height: 90px;">

        </div>
    </div>


</div>
</template>

<script>
    export default {
    props: ['theImage','theAlbumImages'],
     data() {
        return {
        image: this.theImage,
        albumImages: this.theAlbumImages

        }
     },


        methods: {

        },




    }
 let csrfToken = document.querySelectorAll('meta[name=csrf-token]')[0].getAttributeNode('content').value
    Dropzone.options.dropzone = {
        paramName: "file", // The name that will be used to transfer the file
        maxFilesize: 10, // MB
        acceptedFiles: "image/*",
        addRemoveLinks: true,
        init: function() {
            this.on("success", function(file,albumImage) {

               // I want to get a reference to the vue instances "albumImages" property


            });
        },
        headers: {
            'x-csrf-token': csrfToken
        }
    };
</script>

1 个答案:

答案 0 :(得分:0)

您可以尝试使用vue-script2

您将能够访问模板中的vue变量。

    @Override
public void process(Exchange exchange) throws Exception {
    try
    {
        List<Map<String, Object>> currentList = new ArrayList<Map<String,Object>>();
        List<Map<String,Object>> newList = new ArrayList<Map<String,Object>>();
        currentList = (List<Map<String,Object>>)exchange.getIn().getBody();
        newList = OrganizeListForInsert(currentList);
        exchange.getIn().setBody(newList);

    }
    catch(Exception e)
    {
        e.printStackTrace();
    }
}

尽管可能不起作用。其他选择是尝试在已装载的装载功能。例如

<script2>
....
 this.on("success", function(file,albumImage) {

              var x = {{albumImages}}


            });
....
</script2>