js调用vue方法，vue.js引入封装组件

今天在vue和js共存的html中开发，首次碰倒这种，虽然简单但自己还是不会。
在这里简单记录一下VUE和JS方法的互相调用

<script>
		new Vue({
     
			el: '#app',
			data: function() {
     
				return {
      
				}
			},
			created: function (){
     
				window.creatAjaxF = this.creatAjaxF();
			},
			methods: {
     
				creatAjaxF(){
     
					console.log('我是VUE中的函数，')
				}
			}
		})
		function attempt() {
     
			var a = '我是js 中方法'
			return a
		}
</script>

vue 调用js 的方法：

	//直接在vue中调用方法名即可
	created: function (){
     
		attempt()
	}

js 调用vue 的方法：

	//将new Vue({ })赋值给一个变量，js中通过： 变量.方法名()    如下
	var vm = new Vue({
     
			el: '#app',
			data: function() {
     

	function attempt() {
     
		var a = '我是js 中方法'
		vm.creatAjaxF()   //vue中方法
		return a
	}

html 中引入vue.js，封装组件简单方法 记录下

   //父元素
   <child1 ref="child1"></child1>  //标签
   
   <script src="assets/component/viewDetails.js"></script>  //引入
   
   components:{
     
		'child1': child1
	},
	
	lookClick(val) {
     
		this.$refs.child1.lookClick(val);   //父组件调用子组件（lookClick）方法
	},

	//  viewDetails.js  封装的组件
	var child1 = {
     
    props: {
       //接受参数
        // form_buy: {
     
        //     type: Object,
        //     default: ''
        // }
        form:{
     }
    },
    template: '
\n' +
    '\n' +
    '\n' +
        '\n' +
           '{
     {form_sell.phone}}\n' +
        '\n' +
    '\n' +
	'\n' +
   '
',

    data() {
      //Vue中component的data必须通过function() return
        return {
     
            dialogFormVisible_sell: false,
            form_sell: {
     
                orderNum:'',
            },
                addr_type:''
            },
        }
    },
    methods: {
     
        lookClick(val){
     
            // code ...
        }
    }

}