使用Vue Router在切换来回链接时禁用jquery

时间:2016-08-17 19:49:18

标签: jquery vue.js

我正在使用vue路由器进行导航。我有多个页面,包括一个家和我们的页面。我有一些jquery写在我的主页的另一个JS文件中工作得很好,但是当我点击我的关于我们页面然后回到我的主页时,脚本停止工作。当我转到另一个页面然后回到我的主页时,这也适用。我有一种感觉这是由于我的vue路由器。 jquery脚本如下:

$('.arrow_down').click(function() {
    $('html, body').animate({
        scrollTop: $('.ourservices').offset().top
    }, 600);
});

我的vue路由器看起来像:

// Define some components
var home = Vue.extend({
    template: '#home-template'
})

var aboutus = Vue.extend({
    template: '#aboutus-template'
})

var portfolio = Vue.extend({
    template: '#portfolio-template'
})

var contact = Vue.extend({
    template: '#contact-template'
})

// The router needs a root component to render.
// For demo purposes, we will just use an empty one
// because we are using the HTML as the app template.
// !! Note that the App is not a Vue instance.
var App = Vue.extend({})

// Create a router instance.
// You can pass in additional options here, but let's
// keep it simple for now.
var router = new VueRouter({
    hashbang: false,
    history: true,
    linkActiveClass: "active"
})

// Define some routes.
// Each route should map to a component. The "component" can
// either be an actual component constructor created via
// Vue.extend(), or just a component options object.
// We'll talk about nested routes later.
router.map({
    '/': {
        component: home
    },
    '/aboutus': {
        component: aboutus
    },
    '/portfolio': {
        component: portfolio
    },
    '/contact': {
        component: contact
    }
})

// Now we can start the app!
// The router will create an instance of App and mount to
// the element matching the selector #app.
router.start(App, '#app')

随意询问其他信息。

1 个答案:

答案 0 :(得分:1)

您可以将脚本包含在组件就绪函数中:

JSON_FILE=${SRCROOT}/*****/ServiceAccount.json
GOOGLE_APP_ID=1:**********:ios:*********

defaults write com.google.SymbolUpload version -integer 1

JSON=$(cat "${JSON_FILE}")
/usr/bin/plutil -replace "app_${GOOGLE_APP_ID//:/_}" -json "${JSON}" "$HOME/Library/Preferences/com.google.SymbolUpload.plist"
"${PODS_ROOT}"/FirebaseCrash/upload-sym

参考样本小提琴https://jsfiddle.net/tsuqmzhL/23/

另请参阅Vue Instance Lifecycle https://vuejs.org/guide/instance.html#Lifecycle-Diagram