javascript - VueJS2 and the Window Object - how to use? -
i trying use third-party api collect data user. unsure how go setting in vue instance.
here's test code in jsfiddle: demo to see issue, choose "def" dropdown , select brief , see element @ bottom of page 'fill out brief form here'.
snipped html code custom trigger attribute:
<div class="alert alert-warning" v-if="(!selectedoffice.injira) && (product ==='brief')">fill out brief <a href="#" class="mycustomtrigger"> form here</a></div>
the javascript code data collector:
jquery.ajax({ url: "https://organik.atlassian.net/s/d41d8cd98f00b204e9800998ecf8427e-t/1gaygj/b/c/3d70dff4c40bd20e976d5936642e2171/_/download/batch/com.atlassian.jira.collector.plugin.jira-issue-collector-plugin:issuecollector-embededjs/com.atlassian.jira.collector.plugin.jira-issue-collector-plugin:issuecollector-embededjs.js?locale=en-us&collectorid=208a7651", type: "get", cache: true, datatype: "script" }); /* script specifying custom trigger. we've replaced 'mycustomtrigger' 'feedback-button' */ window.atl_jq_page_props = { "triggerfunction": function(showcollectordialog) { //requires jquery available! jquery(".mycustomtrigger").click(function(e) { e.preventdefault(); showcollectordialog(); }); }};
here's how have vue instance set up:
var app = new vue({ el: '#app', data: { //testmessage: 'hello world', selectedoffice: '', selectedproducts: [], officelist: [] }, //data created: function() { //get api json data here //data here demo this.officelist = [{ code: "abc", injira: true }, { code: "def", injira: false }, { code: "ghi", injira: true }, { code: "jkl", injira: false }, { code: "external", injira: false }] }, methods: { clearproductsselection() { return this.selectedproducts = []; } } });
any tips on how utilize window object within vue can trigger custom function? nothing happens @ current moment.
i ended adding following code make work:
window.atl_jq_page_props = { "triggerfunction": function(showcollectordialog) { vue.prototype.$showcollectordialog = showcollectordialog }};
and click handler added view so:
v-on:click="$showcollectordialog"
Comments
Post a Comment