今天在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: '<div>\n' +
    '<el-dialog title="详细内容" :visible.sync="dialogFormVisible_sell" id="formDiv" width="65%" :modal-append-to-body="false" center style="z-index: 2002;">\n' +
    '<el-form label-position="center" label-width="120px">\n' +
        '<el-row :gutter="20">\n' +
           '<el-col :span="12"><el-form-item label="手机号:">{{form_sell.phone}}</el-form-item></el-col>\n' +
        '</el-row>\n' +
    '</el-form>\n' +
	'</el-dialog>\n' +
   '</div>',

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

}